Angular 为什么在*ngFor=";中更改数组中的元素顺序;设x/xs“;不会';一旦发生变化,是否触发组件?
我有一个父组件:Angular 为什么在*ngFor=";中更改数组中的元素顺序;设x/xs“;不会';一旦发生变化,是否触发组件?,angular,Angular,我有一个父组件: <div *ngFor="let slice of slices"> <my-slice [slice]="slice"> </div> export class SliceComponent implements OnChanges { @Input() slice: Slice; ... } 如果我在父组件中运行以下代码,子组件将不会得到更新,尽管视图顺序确实会更改 let slice = th
<div *ngFor="let slice of slices">
<my-slice [slice]="slice">
</div>
export class SliceComponent implements OnChanges {
@Input()
slice: Slice;
...
}
如果我在父组件中运行以下代码,子组件将不会得到更新,尽管视图顺序确实会更改
let slice = this.slices[0];
this.slices[0] = this.slices[1];
this.slices[1] = slice;
此外,如果我添加以下内容
<div *ngFor="let slice of slices; let i=index">
<my-slice [slice]="slice" [sliceOrder]="i">
</div>
现在,onChanges
将被激发,并将更改设置为sliceOrder
,而不是slice
angular2如何选择组件输入属性中更改的内容?为什么在这种情况下,更改的是
sliceOrder
,而不是slice
?
检查数组内容以了解何时更新,但Angular2更改检测不检查数组或对象内容。它只检查对象标识
作为变通办法
- 您可以创建数组的副本以获取新标识
this.arr=this.arr.slice()
- 您可以实施
并自己检查内容更改,例如使用Angular提供的ngDoCheck
。另见IterableDiffers
*ngFor
检查数组内容以了解何时更新,但Angular2更改检测不会检查数组或对象内容。它只检查对象标识
作为变通办法
- 您可以创建数组的副本以获取新标识
this.arr=this.arr.slice()
- 您可以实施
并自己检查内容更改,例如使用Angular提供的ngDoCheck
。另见IterableDiffers