javascript - 从指令 Controller 添加选择框

Question

我正在尝试从指令动态添加选择框。相同的 ng 选项在没有指令的情况下完美工作，但从指令中它给出了空列表。请检查下面的 fiddle 。

我不想将选择框放入指令模板中...我需要仅从 Controller 添加它们..

fiddle :: http://jsfiddle.net/NfPcH/2009/

代码:

<select ng-model="selectedOption" ng-options="option for option in [1,2,3,45,6,8,9,7]"></select>

Answer 1

解决问题的正确方法是使用指令 compile 函数(读取 'Compilation process, and directive matching' and 'Compile function' )在编译之前修改元素。

<强> Working Demo

app.directive('hello', function () {
    return {
        restrict: 'E',
        scope: {},
        template: 'hello world',
        controller: function ($scope, $element, $attrs, $compile) {
            var el = angular.element('<select ng-model="selectedOption" ng-options="option for option in [1,2,3,45,6,8,9,7]"></select>');
            $compile(el)($scope);
            $element.append(el);
        },
    }
});