Question

我有一个使用$compile服务生成模板的指令。它不会使用ng-options或ng-repeat生成选择选项，即使我在我的范围内明确设置了users数组。为什么这不起作用？这只是给我一个空白<select>字段，没有选项。

angular.module("myApp").directive("selectForm", [
  '$compile',
  function($compile) {
    return {
      restrict: 'C',
      scope: true,
      link: function(scope, element, attrs) {

        scope.users = [
          { id: 1, name: "User 1" },
          { id: 2, name: "User 2" }
        ];

        element.on('click', function(e) {

          var selectHtml = $compile('\
            <select\
              class="col-lg-2 form-control"\
              ng-options="user.id as user.name for user in users">\
            </select>\
          ')(scope);

          $(element).html(selectHtml);
        });

      }
    }
  }

]);

Answer 1

您的代码中需要更改一些内容才能使其正常工作：

<select>仅在您提供ng-model
将您的代码包含在scope.$apply。
致电element.off("click")取消订阅活动以避免闪烁。

DEMO

使用ng-repeat对范围进行Angular $ compile不起作用

1 个答案: