Question

我有问题。搜索了几个小时后，我无法找到解释。我想显示一个模态（来自primeNG）并在用户点击按钮时显示它。这个按钮调用（带有id）到我的API REST并带来信息，非常简单。我收到了这些信息，但是当模态应该显示时，这不会发生。

map.component.ts

export class MapComponent implements OnInit {

  public alteraciones: any[];
  public alteracion: any = {};
  display: boolean = false;
/*...*/
generateData(map: L.map) {
    const data: any[] = [];
    let marker: any;

    L.geoJson(this.alteraciones, {
      pointToLayer: (feature, latlng) => {
        marker = L.marker(latlng, {
          icon: this.getIconMarker(feature.properties.tipo_alteracion)
        });

        marker.on('click', (e) => {
          this.getInfoAlteracion(feature.properties.id_alteracion); // <==
        });
        data.push(marker);
      }
    });    
/*...*/

  }
/**...**/
getInfoAlteracion(id_alteracion: string) {
    this.mapService.getInfoAlteracion(id_alteracion).subscribe(
      result => {
        this.alteracion = result;
        console.log(this.alteracion); // < == Information OK
        this.display = true; // <== this variable should change but doesn't
      },
      err => console.log(err)
    );
  }

}

map.component.html

<p-dialog header="Info" [(visible)]="display" modal="modal" width="500" [responsive]="true">
<!--some code-->
  <p-footer>
    <button type="button" pButton icon="fa-close" (click)="display=false" label="Cerrar"></button>
  </p-footer>
</p-dialog>

但是，当我重新编译或关闭服务器时，显示变量的值会发生变化，并显示模态。我找不到任何解释，任何想法？

修改

可能的冲突：

@ asymmetrik / ngx-leaflet：3.0.2

@ asymmetrik / ngx-leaflet-markercluster：1.0.0

编辑2

我还添加了一个新标记，其中包含一个要更改的新变量，但也不起作用。在这一点上，我认为（我90％肯定）这是component.ts和component.html之间的沟通问题。

Answer 1

尝试将该布尔显示属性设为公开！

Answer 2

最后，我解决了这个问题。感谢这个link，我意识到这是库之间兼容性的问题。 Leaflet事件处理程序在Angular的区域之外运行，不会自动检测输入绑定字段的更改。为了确保检测并应用我的更改，我需要在Angular的区域内进行更改。最后，将它添加到代码中，所有工作都可以：

constructor(private mapService: MapService, private zone: NgZone) { }

 marker.on('click', (e) => {
          this.zone.run(() => {
            this.getInfoAlteracion(feature.properties.id_alteracion);
          });
        });
        data.push(marker);
      }

感谢大家的帮助！

布尔值不会改变

2 个答案: