Javascript 如何访问角度选择元素的选项？

我正在尝试编写一个属性指令，用于增强

select

元素。作为此增强功能的一部分，我需要访问

选择

元素的

选项

子元素（因此我希望能够在

链接

功能中访问它们）

例如，下面是一个非常基本的模板：

<div ng-app="test" ng-controller="TestCtrl">
    <select ng-model="selected" ng-options="i for i in data" enhanced></select>
</div>

最后是一个非常基本的指令：

t.directive("enhanced", function () {
    return function ($scope, $element) {
        console.log($element.find("option").length); // Always 0
    };
});

下面是一个完整的例子

---

问题是在

link

函数中，

ng options

指令尚未执行，

select

元素仍然为空。是否有办法推迟指令的执行，直到

ng options

指令完成？或者有更好的方法来实现这一点吗？

您可以在指令中使用$timeout

t.directive("enhanced", function ($timeout) {
    return function ($scope, $element) {
        $timeout(function(){
            console.log($element.find("option").length); // 3
        })
    };
});

这是一个

另一种选择是使用观察者：

t.directive("enhanced", function () {
    return function ($scope, $element) {
        $scope.$watch('selected', function () {
            console.log($element.find("option").length); // 3
        });
    };
});

这种方法的唯一问题是，它将在表达式更改时运行，因此您必须在第一次更改后取消更改

这是一个

选项位于

$scope.$watch

语句中。因此，无法查看

链接

函数中的选项列表，因为以后将调用

监视

---

在此之前反思选项列表的唯一方法是自己解析

attr.ngOptions

并在需要时获取列表。

我可以，但这不是很好。必须有更好的方法来处理此问题。观察表达式如何？此方法的问题是，它将在表达式更改时运行，因此您必须在第一次更改后取消跟踪。我可能正在寻找

$watch

。我确实试过了，但方式不同。谢谢你的帮助，我一直在努力进入一个角度的思维方式。

t.directive("enhanced", function () {
    return function ($scope, $element) {
        $scope.$watch('selected', function () {
            console.log($element.find("option").length); // 3
        });
    };
});