angularjs - 无法在自定义指令中获取已解析的属性

Question

我一直在尝试为具有动态 id 的输入字段编写自定义指令，在指令中无法获得正确的 id。

<input id="myInput{{$index}}" my-dir="fn()"/>

myApp.directive('myDir', function ($parse) {
    var obj = {
        require: "ngModel",
        link: {
            post: function (scope, element, attrs) {
                var fn = $parse(attrs.myDir);
                var elementId = element.attr('id');
                console.log(elementId); // Here I see myInput{{$index}} instead of myInput0, by this time angular is not resolving the value         
            }
        }
    };
    return obj;
});

我的问题是，我怎样才能得到指令中的解析值。此外，由于其他原因，我不能在这里使用任何孤立的范围。

提前致谢

Answer 1

您可以使用$observe来观察包含插值的属性的值变化（例如src="{{bar}}"）。这不仅非常有效，而且也是轻松获得实际值的唯一方法，因为在链接阶段尚未评估插值，因此此时值设置为 undefined。

post: function (scope, element, attrs) {
    attrs.$observe('id', function (id) {
        console.log(id)
    })
}

Answer 2

如果你只想在链接函数中计算一次值，你可以使用 $interpolate （记得将它注入你的指令）：

console.log($interpolate(element.attr('id'))(scope));

但是，由于您可能正在使用 ng-repeat （因为使用$index）我更喜欢@sza 的答案，因为您的列表可能会更改，因此您可能需要对列表的更改做出反应。