angular2 @Input EventEmitter update view

iamは単純なグリッドコンポーネントを作成しようとしていますが、イベントが発生した後にビューを更新するのに問題があります。シンプルなコンポーネントを更新した後にビューが再レンダリングされない理由を知ってください。このコードで何が間違っていますか？angular2 @Input EventEmitter update view

export class GridComponent implements OnInit { 
    @Input() resource: any []; 
    @Output() saveModel = new EventEmitter(); 
    @Output() deleteModel = new EventEmitter(); 
    attributes: any[]; 
    isUpdating: boolean = false; 
    updatingID: number; 

    constructor() {} 

    ngOnInit() { 
    this.attributes = Object.keys(this.resource[0]); 
    } 

    toggleUpdate(id, flag = true) { 
    this.isUpdating = !this.isUpdating; 
    this.updatingID = flag ? id : undefined; 
    } 

    destroy(id) { 
    this.deleteModel.emit(id); 
    } 

    save(model) { 
    this.saveModel.emit(model); 
    this.toggleUpdate(model.id, false); 
    } 

    cancel(id) { 
    this.toggleUpdate(id, false); 
    } 

}

ここhttps://plnkr.co/edit/InxsHu9GwCtMplYoocsS?p=preview

出典

2016-09-26 Oleg Protsenko

予想される動作は何ですか？問題を再現するためにはどのような手順が必要ですか？ –

私はオブジェクトの配列を持っていて、グリッドコンポーネントでは、この配列上の* ngForディレクティブループと、カスタムパイプを持つオブジェクトに対する2番目の* ngForループを持っています。 GridComponentは@Outputを破棄して保存します。更新ボタンをクリックすると、データコンポーネントの代わりに、モデルの現在の値を持つ入力が表示され、モデルにバインドされます。 Saveメソッドのトリガーイベントと親コンポーネントがそのイベントをリッスンし、新しいデータが正しく渡された後、新しい配列で置き換えられますが、同じデータが画面上に表示されます。私はngOnChangesイベントを実装しようとし、this.resource = values.resource.currentValueに、成功なしで割り当てました –

resourceデータは、親と子のコンポーネントに適切に更新された全例、ちょうどフォームは、更新は表示されません。

valuesパイプを変更する必要があると思うのは、値だけでなくキーを返すようにしてから、キーで変数*ngForを使って値にアクセスし、ビュー内の値を直接取得することです。

出典

2016-09-26 10:30:13

EDITED： ギュンター・ゼシュバウアー、私の時間を保存してくれてありがとう！

キーを返すだけで値は返さないように値パイプを変更し、キーで* ngFor変数を使って値にアクセスする必要があると思います。ビュー内の値を直接取得するには

これは悪の根源です

出典

2016-09-26 10:34:13

angular2 @Input EventEmitter update view

答えて

関連する問題