Question

我正在将谷歌地图实施为离子，但我在尝试实施标记和信息时遇到了问题。

如下所示，一旦我尝试为每个标记实现信息窗口，它就会按预期工作：

this.markerStart[0].addListener('click',()=>{
             console.log('clicked')
             this.popuparray[0].open(this.map,this.markerStart[0]);
         })
         this.markerStart[1].addListener('click',()=>{
             console.log('clicked2222')
             this.popuparray[1].open(this.map,this.markerStart[1]);
         })

但是当我尝试修改它以使用for循环时，它不起作用。

它看起来完全一样，但我不知道它为什么不起作用。

//这里，this.markerStart.length是2 ...但它在for循环中不起作用。

console.log(this.markerStart);
    console.log(this.markerStart.length);
    console.log("this.markerStart")
    for(var j=0; j<this.markerStart.length; j++){
        this.markerStart[j].addListener('click',()=>{
            console.log(j);
            //only log 2 ...which is I don't understand. why log 2?
           // j should be 0 and 1...because this.markerStart.length is 2
            this.popuparray[j].open(this.map,this.markerStart[j])

        })
    }

我也尝试了这个：

  for(var j=0; j<2; j++){

        this.markerStart[j].addListener('click',()=>{
            console.log(j);
        })
    }

我首先想到，当我点击第一个标记时，它应该记录1，当点击第二个标记时，它应该是log 2，但它只记录2。

Answer 1

使用上一个解决方案closure，所以为什么你没有得到预期的结果。您可以使用let代替var，它会起作用。 var将保留您的变量，对于每次迭代，您只会更改唯一的变量j。毕竟，您引用变量j，其值为2。对于每次迭代，let将创建一个新变量，每个函数将拥有它自己的变量j。

 for(let j = 0; j < 2; j++){
     this.markerStart[j].addListener('click',() => console.log(j));
 }

或者如果你想在ES6下的环境中，你可以使用IIFE为听众创建一个范围变量

for(var j = 0; j < 2; j++){
    ((k) => this.markerStart[k].addListener('click', () => console.log(k)))(j);
}

Answer 2

只需将var j=0;替换为let j=0; for for循环，它就会按预期工作。

因为let声明的变量在范围上受限于使用它的块，语句或表达式。另一方面，var全局定义变量，或者在整个函数中本地定义变量，无论块范围如何。

单击addListener实现forloop

2 个答案: