0

이 구성 요소와 동일한 문제가있는 구성 요소가 있습니다. 필드 값이 변경되면 뷰가 업데이트되지 않고 강제로 변경 감지를 시도했지만 작동하지 않습니다.Angular2 뷰가 변수 변경 후 업데이트되지 않음

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(); 
    } 
} 

chatService.getMessages 다시 표시 Observable.

답변

2

부모 구성 요소에 changedetectionstrategy ~ onPush을 설정했습니다. 메시지에는 텍스트 필드가 아니라 메시지 필드가 있으므로 업데이트를 적용해도 아무런 영향이 없습니다. 비슷한 문제가있는 사람은 누구나 changedetectionstrategy 상위 구성 요소도 찾습니다.

관련 문제