Question

我是Typeular的Angular2新手。我目前正在开展一个项目，不幸的是，无法理解OnPush做了什么：

changeDetection：ChangeDetectionStrategy.OnPush

我搜索了很多，但没有找到（不明白）正确答案。

有人可以向我解释一下吗？示例可以是值得赞赏的。

Answer 1

推送更改检测意味着仅当输入发生变化时才会运行组件的更改检测，并且当输入发生更改时，其整个对象必须更改。这意味着如果仅参考更改，则不会运行更改检测。

例如，如果您对作为数组的组件有输入：

@Input() testArray: Item[] = [];

如果使用push在父组件中修改该数组，则不会对子组件运行更改检测。但如果你这样做：

array = [...array, newItem];

<test-component [testArray]="array"></test-component>

将运行更改检测。这用于提高应用程序性能，因为它大大减少了更改检测的运行次数。它通常与不可变数据结构配对，尤其是Redux模式与store配对，例如@ngrx/store。

Answer 2

我认为通过一个例子更容易理解：

您有一个具有Input属性的组件：

ToString

如果您使用

之类的内容修改此人的初始值

type Person {
  name: string;
  surname: string;
}
@Component({
    selector: 'my-component',
    changeDetection: ChangeDetectionStrategy.OnPush,
    template: `<p> {{person.name}} {{person.surname}} </p>`
})
class myComponent {
  ...
  @Input() person: Person;
  ...
}

Angular不会检测到该更改，因为它认为对象本身是相同的。您已更改对象的属性，而不是对象本身。您需要更改整个对象（引用）以使Angular检测到此更改：

person.name="changed";

所以就像angular将输入元素视为不可变对象一样，它们内部的任何变化都将被忽略。

Answer 3

你可以查看它带有样本https://angular-2-training-book.rangle.io/handout/change-detection/change_detection_strategy_onpush.html

的网址吗？

Strategy OnPush意味着什么？

3 个答案: