2016-06-16 8 views
0

現在親コンポーネントの配列を削除しようとしている子コンポーネントに問題があります。角度2の子コンポーネントが親コンポーネントの配列から項目を削除しています

親コンポーネント:

@Component({ 
    selector: 'parent', 
    templateUrl: 'app/templates/parent.html' 
}) 

export class ParentComponent { 

    public items = []; 
} 

親HTML

<child [items]="items"></child> 
    <product *ngFor="let item of items><product> 

子コンポーネント

@Component({ 
    selector: 'child', 
    templateUrl: 'app/templates/child.html' 
}) 

export class ChildComponent{ 
    @Input() items; 

    emptyItems() { 
     this.items = []; 
    } 
    addItem() { 
     this.items.push({'title': 'foo'}); 
    } 
} 

私はemptyItems /のaddItem関数を呼び出すときただし、子ビュー内の項目の配列が反映されますしかし、親コンポーネントでは変更されません。

は、私は出力を使用する必要がありますか?

答えて

1

正しい方法は、我々はあなたのitemsに結合、二の方法を使用することができますしかしOutputhttps://angular.io/docs/ts/latest/cookbook/component-communication.html#

を使用することで、これは両側に変更が反映されます:

<child [(items)]="items"></child> 

は詳細https://angular.io/docs/ts/latest/guide/cheatsheet.html

を参照してください。

更新: 配列を別の方法で空にしてみてくださいHow do I empty an array in JavaScript?

Outputhttps://angular.io/docs/ts/latest/api/core/index/Output-var.html アイデアを動作するはずですが、あなたは私のために仕事をdidntの

+0

のメンバーitemsから更新物事を通過して、手動で更新する必要があることですが、私はemptyItems関数と呼ばそれは親オブジェクトに何もしませんでしたが、それは任意の項目を表示していない期待していた – tony

関連する問題