slim-lang中的Ruby每个循环

Question

我希望能够通过javascript遍历实例变量，但我不太确定如何使其工作。

javascript:
  -@spots.each do |spot|
      map.addMarker({
        lat: "#{spot.latitude}",
        lng: "#{spot.longitude}",
        title: "spot",
      });
  });

我尝试过的方法:使用<% @spots.each do |spot| %>，不带引号#{}

Answer 1

似乎一旦你在ruby slim块中，你就不能再做javascript:循环了。

我能让这个基本上正常工作

- @spots.each do |spot|
  javascript:
    map.addMarker({
      lat: #{spot.latitude},
      lng: #{spot.longitude},
      title: "spot"
    });

但这使得每个addMarker调用都有单独的脚本标记，这看起来很愚蠢。

您还可以尝试将数据作为JSON放在页面上，然后在Javascript中执行循环。如下所示：

javascript:
  var spots = #{raw @spots.to_json};
  var ii = 0;
  var nspots = spots.length;
  for(;ii<nspots;++ii) {
    theMap.addMarker(spots[ii]);
  }

您可能希望确保在运行这段代码时theMap已经可用，但我认为这可能会起作用。您还应该检查每个@spot的JSON格式。根据您设置JSON的方式，每个spot可能如下所示

{'spot': { 'latitude': ###, 'longitude': ### } } 

这意味着你必须在循环中取消对对象的引用。

Answer 2

容易修复，但如果斑点太长则效率不高。

-@spots.each do |spot|
  javascript:
    map.addMarker({
      lat: "#{spot.latitude}",
      lng: "#{spot.longitude}",
      title: "spot",
    });

在js中查看上下文循环，而不是

javascript:
  var spots = #{@spots.to_json};
  $(spots).each(function(index, obj) {
    map.addMarker({
      lat: obj.latitude,
      lng: obj.longitude,
      title: "spot",
    });
  });