Question

我正在使用Angular 5.在@Output() EventEmitter中，当我得到一些变量时，在绑定函数中，虽然我可以更改值和控制台，但它没有＆＃39;反映在视图方面。

以下是我上面描述的代码：

{{ visible }} <!-- visible remains "true" before and after emit -->

<app-my-component (objChange)="onChange($event)"></app-my-component>

onChange(obj) {
  this.var = obj.var;
  this.visible = false;
  console.log(this.visible); // which logs "false" correctly.
}

我在Google Maps标记事件监听器中触发了我的发射器：

marker.addListener('click', () => {
    this.objChange.emit(obj);
});

我已经和Angular 4+合作了很长一段时间（差不多一年），而这种情况从未发生过。可能有什么不同（但我不知道其中任何一个可能是原因）这次是：

EventEmitter以某种方式由Google Maps API触发（使用@types/googlemaps导入）
我上周将@angular/cli更新为版本6（项目仍为第5版）

这对我来说似乎更奇怪，这个问题只发生在我在这个页面上启动我的项目时。（也就是说，如果我前往另一个页面然后回来，它就可以了。）重启ng serve或尝试使用rxjs对我来说都失败了。如果有人遇到过同样的问题，你能否分享一下如何解决这个问题？谢谢！

Answer 1

问题很可能是您正在使用Google地图和某种异步功能，而在回调中，您运行this.objChange.emit()。

这将导致Angular不知道你刚刚做了什么，因此它不会触发变化检测。

简单的解决方法是导入NgZone并在@Output函数中包含run的发音：

constructor(private ngZone: NgZone) {}

someAsyncGoogleFunction
  .then(() => {

    this.ngZone.run(() => {
      this.objChange.emit();
    });
  })

角度视图不会对变量进行更新

1 个答案: