Question

在Angular中我实施了AGM地图，我想从服务器响应中设置图标网址，我已经实现了以下代码，

HTML

<agm-map
        [latitude]="mapLat"
        [longitude]="mapLng"
        [zoom]="zoom"
        [zoomControl]="false" >
        <agm-marker
            *ngFor="let provider of providers; let i = index;"
            (markerClick)="getProviderDetails(provider,'marker')"
            [latitude]="provider.latitude"
            [longitude]="provider.longitude"
            [iconUrl]='getIcon(provider, i)'>
            <!-- [iconUrl]='{"url": provider.avatar,"scaledSize": {"height": 25, "width": 25}}' -->
        </agm-marker>
</agm-map>

组件

public getIcon(provider: any, index) {
    console.log("Index " + index);
    let icon: any = {
        "url": provider.avatar,
        "scaledSize":
        {
            "height": 25,
            "width": 25
        }
    };
    return icon;
}

当我在代码*ngFor之上运行时，一次又一次地连续无限次迭代，而providers对象的length只有6。

如果我尝试下面的行直接传递像这样的对象没有getIcon(provider, i)方法调用那时它是有效的。

[iconUrl]='{"url": provider.avatar,"scaledSize": {"height": 25, "width": 25}}'

Angular 5 - agm-marker设置iconUrl，方法不起作用

0 个答案: