Angular2 KeyValueDiffers在init之后检测更改而不更改对象

Question

我有一个表格，我有一个js对象作为模型。 我想检测对象的变化，告知用户需要保存。

为实现这一目标，我目前正在使用KeyValueDiffers。它还可以根据需要检测每个更改。虽然我有不良影响。

表单是一个自己的组件，我将对象设置为在@Input()上进行修改，该init()调用KeyValueDiffers方法，该方法也使用新对象初始化KeyValueDiffers。

初始化export class MetadataDetailComponent implements DoCheck { constructor(private differs: KeyValueDiffers) { } unsavedChanges: boolean = false; differ: any; metadata: Metadata; orgMetadata: Metadata; @Input() set setMetadata(metadata: Metadata) { this.init(metadata); } private init(metadata: Metadata) { this.differ = undefined; if (this.metadata && this.unsavedChanges) { console.log('unsaved changes!!') } //Do different init stuff this.orgMetadata = metadata; this.metadata = new Metadata(metadata.name, metadata.description, metadata.id, metadata.state, metadata.type, metadata.script); this.differ = this.differs.find(this.orgMetadata).create(null); this.unsavedChanges = false; } ngDoCheck() { if (this.differ) { var changes = this.differ.diff(this.metadata); if (changes) { this.unsavedChanges = true; console.log('metadata has changed!'); } } } } 后，我立即收到更改通知，尽管我用来初始化差异的对象没有变化。为什么会这样？我一无所知......

KeyValueDiffers

修改

这是我得到的改变事件

这似乎是从null到对象的变化。但是，当我已经用对象初始化.no-container { margin-left: 0 !important; margin-right: 0 !important; } .row { border: 1px solid #999; }时，为什么我会收到此更改？

Answer 1

我不知道这是否可以解决您的特定问题。但是，在ngOnInit之后，KeyValueDiffer在第一个差异上具有“ null”作为先前值时遇到了问题。我已经梳理了互联网，却没有找到真正的答案，因此我们通过像这样初始化差异来“解决”

this.differ = this.differs.find(this.orgMetadata).create().diff(this.orgMetadata);

或者针对您的具体情况

this.differ = this.differs.find(this.orgMetadata).create().diff(this.metadata);

请注意，在Angular 6+中，create不再接受参数了