ngModel更新在控制器，但不是在视图，角2 [英] ngModel updates in controller, but not in the view, angular 2

问题描述

我有一个输入在我看来：

I have an input in my view:

  <label for="map-latitude_input">Latitude {{mapLatitudeInput}}</label>
  <input
    type="text"
    placeholder="00.000"
    [(ngModel)]="mapLatitudeInput"
    [ngFormControl]="newListingForm.find('mapLatitudeInput')"
    id="map-latitude_input"
    class="transparent">

和我的控制器中我听来映射从谷歌地图API的拖动事件。在拖我想我里面输入，并在其相关联的标签更新的价值。目前，这看起来是这样的：

and inside my controller I am listening to map drag event from google maps api. On drag I want to update value inside my input and in its associated label. At the moment this looks like this:

//Update coordinates on map drag
map.addListener('drag', (event) => {
  this.mapLatitudeInput = map.getCenter().lat();
  console.log(this.mapLatitudeInput);
});

现在，当我拖动地图的控制台一直为我四处移动它输出正确的值，但是在我看来，它保持完全一致。我还注意到的是，如果我拖动地图四周，比做一些动作一样选择相同的形式，我的输入是，它更新内选择菜单中的选项 mapLatitudeInput 来纠正值，我不知道为什么会这样，但认为我会提到它。

Now when I drag a map console keeps outputting correct value as I move it around, however in my view it stays exactly the same. What I also noticed is that if I drag map around and than do some action like select an option in select menu within same form that my input is in, it updates mapLatitudeInput to correct value, i'm not sure why this happens, but thought I'd mention it.

推荐答案

这也许是由于ZoneJS。这个问题可以给你一些提示：不更新变化Angular2查看。

It's perhaps due to ZoneJS. This question could give you some hints: View is not updated on change in Angular2.

从你在哪里得到你的地图实例。如果它的实例化的区域外，Angular2将不能够检测到 mapLatitudeInput 属性的更新。

From where do you get your map instance. If it's instantiated outside a zone, Angular2 won't be able to detect updates of the mapLatitudeInput attribute.

您可以尝试这样的事情：

You could try something like that:

export class MapComponent {
  constructor(ngZone:NgZone) {
    this.ngZone = ngZone;
  }

  map.addListener('drag', (event) => {
    this.ngZone.run(() =>
      this.mapLatitudeInput = map.getCenter().lat();
      console.log(this.mapLatitudeInput);
    });
  });

这个问题可以也关系到你的问题：<一href=\"http://stackoverflow.com/questions/34761224/angular2-child-property-change-not-firing-update-on-bound-property/\">Angular2子属性的变化不是绑定属性射击更新。

This question could be also related to your problem: Angular2 child property change not firing update on bound property.

希望它可以帮助你，
蒂埃里

Hope it helps you, Thierry

这篇关于ngModel更新在控制器，但不是在视图，角2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！