Question

我试图获取一个DOM元素，以便在AngularJS1.0.6指令中更改它。

HTML：

<li ng-repeat="car in cars" data-highlight="{{car.id}}">

指令：

var iw = angular.element(document.querySelector('#iw-' + id));
console.log("iw=" + iw);

有关详细信息，请参阅plunker：https://plnkr.co/edit/dP2cvut4f5ao5pFe6ka0?p=preview

Answer 1

经过一番研究，我才能使它发挥作用。当你在ng-repeat（也是指令）中使用指令时，基本上会出现第一个问题。在这种情况下，指令的范围必须设置为例如：scope: {car: '=highlight'}。 This可以说明会发生什么。我宁愿使用<ul highlight="cars"></ul>和指令的模板，如'<ul><li ng-repeat="car in cars"></li></ul>'。所以ng-repeat将在指令内部。

当你通过时，另一个问题是同步两个指令（不同的范围）。您需要DOM准备从另一个指令中选择元素。我将你的compliled元素保存到car对象 - 它可以算作变通方法，使其更容易。

Forked plunker here

Answer 2

<li ng-repeat="car in cars track by $index" data-highlight="{{car.$index}}">

或

如果存在任何属性，在您的情况下，car必须具有id属性

在AngularJS指令中获取DOM元素

2 个答案: