javascript - Angular 6 - 更改变量但不刷新 View

Question

我有一个数组变量，其中包含对象，就像这样:

[{name: 'Name 1', price: '10$'}, {name: 'Name 2', price: '20$'}, ...]

我有一个 View ，它打印出产品列表，如下所示:

<div *ngFor="let item of items">
   {{item.name}} - {{item.price}}
</div>

这只是一个示例，但问题的“模型”是相同的:

如果我从代码中更改“项目”数组(例如，因为发生了外部事件)，变量值会更改，但 View 不会刷新:(。

我怎样才能让它工作？

编辑:

changeArray() 只包含一行:

changeArray(items) : void{
this.items = 项目；
}

也许问题是，我从另一个组件调用 A 的这个方法？所以，在组件“B”中，我有这样一行:

a.changeArray(items);

Answer 1

强制刷新列表的一种方法是使用扩展运算符...

因此，在更新组件中的(比如)items 属性后，执行此操作，

// after items are updated logic, and assuming it is an array,
this.items = [...this.items];

这应该会刷新您的列表。

如果您提供完整的代码来重现该问题，则可以对这种强制更改方法进行微调。

更新:

根据您的评论，

将 changeArray() 更新为此，

changeArray(items) : void{
  this.items = [...items];
}

更新 2:

如果上面的方法不行，也试试这个，

在定义了 changeArray() 的组件中，将其添加到 constructor 并导入 ChangeDetectorRef，

import { ChangeDetectorRef } from '@angular/core';

constructor(cRef: ChangeDetectorRef) {}

changeArray(items) : void{
  this.items = [...items];
  this.cRef.detectChanges();
}

希望它有效。