2016-08-05 26 views
0

Ich habe diese Komponente (und eine andere mit dem gleichen Problem). Wenn sich der Feldwert ändert, wird die Ansicht nicht aktualisiert. Ich habe sogar versucht, eine Änderungserkennung zu erzwingen, aber es hat nicht funktioniert.Angular2 Ansicht nicht aktualisieren nach Variablenwechsel

Angular-cli 1.0.0-beta.10 
Angular 2.0.0-rc.4 

Component.js

import {Component, OnInit, OnDestroy, ChangeDetectorRef} from '@angular/core'; 
import {Control} from '@angular/common'; 
import {WebsocketService} from './websocket.service'; 


@Component({ 
    moduleId: module.id, 
    selector: 'chat', 
    template: `<div *ngFor="let message of messages"> 
        {{message.text}} 
        </div> 
        <input [(ngModel)]="message" /><button (click)="sendMessage()">Send</button>`, 
    providers: [WebsocketService] 
}) 


export class DummyWebsocketComponent implements OnInit, OnDestroy { 
    messages = []; 
    connection; 
    message; 

    constructor(private chatService:WebsocketService, private changeDetector:ChangeDetectorRef) { 
    } 

    sendMessage() { 
    this.chatService.sendMessage(this.message); 
    this.message = ''; 
    } 

    ngOnInit() { 
    this.connection = this.chatService.getMessages().subscribe(message => { 
     this.messages.push(message); 
     console.info(this.messages); 
     this.changeDetector.markForCheck(); 
     }, 
     error => console.error(error), 
    () => this.changeDetector.markForCheck() 
    ); 

    } 

    ngOnDestroy() { 
    this.connection.unsubscribe(); 
    } 
} 

Die chatService.getMessages kehrt ein Observable.

Antwort

2

Es stellt sich heraus, ich habe changedetectionstrategy zu onPush in der übergeordneten Komponente festgelegt. Und die Nachricht hat kein Textfeld, sondern eine Nachricht, so dass selbst das Erzwingen eines Updates keine Auswirkungen hat. Wenn jemand ein ähnliches Problem hat, suchen Sie auch nach changedetectionstrategy der übergeordneten Komponenten.