给定与 ng-repeat 一起使用的数组，我可以选择使用每个项目创建的单个项目吗？答案

【问题标题】：Given the array used with ng-repeat, can I select an individual item created with each item?给定与 ng-repeat 一起使用的数组，我可以选择使用每个项目创建的单个项目吗？
【发布时间】：2014-05-30 05:33:55
【问题描述】：

我有一个角度应用程序，可以根据地图数据构建区域列表。这些区域使用 ng-repeat 显示在 div 的侧边栏中，并作为矢量特征显示在地图上。当用户在地图上选择一个区域时，我需要滚动到侧边栏中该区域的 DIV。 jQuery 可以在给定元素的情况下执行 scrollTo 操作，并且我知道选择了哪个区域；我可以获得与该项目匹配的 DIV 的引用吗？

我不能使用索引，因为可能对 ng-repeat 数组进行排序或过滤。还有其他选择吗？

编辑：

以下是一些相关代码：

<div class="turf"
    ng-repeat="zone in layers.zones.features"
    ng-class="{
        selected: zone === selectedZone && zone !== highlightedZone,
        hover: zone === highlightedZone
    }"
    ng-click="selectZone(zone); $event.stopPropagation()">

    <h2>{{zone.name}}</h2>
    <input type="text" class="form-control" ng-model="zone.name" />
    {{zone.users}} users present
</div>

当点击地图上的这些区域之一时，Openlayers 将调用一个函数：

zoneLayer.events.register("featureselected", null, function(e){
    var zone=e.feature;
    var element = null; // how do I get the element?

    $(element).scrollTo(); // or similar
});

【问题讨论】：

请发布您的一些代码。您要做的是为每个侧边栏 div 附加一个唯一的 id，并将该 id 存储在相应的地图区域中的某处——但如何做到这一点完全取决于您如何生成地图。
这可能有助于实际滚动：docs.angularjs.org/api/ng/service/$anchorScroll
我会发布一些代码，但它是非常通用的 ng-repeat 东西，并且处理程序都是 OpenLayers。

标签： javascript jquery angularjs openlayers

【解决方案1】：

如果您的区域对象具有 ID 或其他标识符，则将 ID 添加到您的 div

<div class="turf"
    id="{{zone.ID}}"
    ng-repeat="zone in layers.zones.features"
    ng-class="{
        selected: zone === selectedZone && zone !== highlightedZone,
        hover: zone === highlightedZone
    }"
    ng-click="selectZone(zone); $event.stopPropagation()">

    <h2>{{zone.name}}</h2>
    <input type="text" class="form-control" ng-model="zone.name" />
    {{zone.users}} users present
</div>

然后通过 id 找到你的区域

zoneLayer.events.register("featureselected", null, function(e){
    var zone=e.feature;
    var element = $("#" + zone.ID); // how do I get the element?

    $(element).scrollTo(); // or similar
});

如果您无法为 div 添加 ID，则添加 data-zoneID 属性并通过该属性 var element = $("div[data-zoneID=" + zone.ID + "]"); 查找元素

【讨论】：