7

javascript を介してインスタンス var をループできるようにしたいのですが、それを機能させる方法がよくわかりません。

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

私が試したこと: <% @spots.each do |spot| を使用 %> #{} の引用符なし

4

2 に答える 2

8

スリムブロックに入ると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': { 'latitude': ###, 'longitude': ### } }

つまり、ループ内でオブジェクトを逆参照する必要があります。

于 2013-11-09T22:23:24.307 に答える
2

簡単に修正できますが、スポットが長すぎると効率的ではありません。

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

2. ビュー コンテキストの代わりに js でループする

javascript:
  var spots = #{@spots.to_json};
  $(spots).each(function(index, obj) {
    map.addMarker({
      lat: obj.latitude,
      lng: obj.longitude,
      title: "spot",
    });
  });
于 2013-11-09T22:21:47.227 に答える