Angular $compile 与所需的控制器

2024-03-03

我有一个复合列表指令 - 即 - 一个列表项,它本身可以是一个列表。
父指令定义控制器:

.directive('parent', function() {
    controller: function($scope) {
    },
    link: function (scope, element, attrs) {
    }
})

(项目)列表需要父控制器,它本身可以正常工作(为什么不应该......):

.directive('list', function() {
     require: '^parent',
     link: function (scope, element, attrs, parentCtrl) {
     }
  })

对于具体项目也是如此,这也很好:

.directive('item', function() {
    require: '^parent',
    link: function (scope, element, attrs, parentCtrl) {
    }
})

一个项目可能是一个组合,在这种情况下它自己创建一个“列表”。这个组合物是由$compile(ing) 链接函数内的列表项:

link: function (scope, element, attrs, parentCtrl) {
      ...
      $compile("<list></list>")(scope)
      ... 
}

这会引发异常:
无法找到指令“list”所需的控制器“parent”!

原因很明显 - $compile 函数没有提供控制器,因此无法解决“父级”的要求。
所以我尝试手动提供控制器:

$compile("<list></list>")(scope, null, {'parent': parentCtrl});

它不会引发异常,但在需要时仍然不提供此控制器。

知道如何使 $compile 函数接受也应该评估的外部控制器吗?


我刚刚遇到了类似的问题,解决方案似乎是首先将元素添加到父级,然后编译它。

.directive('item', function($compile) {
  return {
    template:'<li><a ng-click="addSubList()">Create Another List</a></li>',
    require: '^parent',
    replace: true,
    link: function(scope, element, attrs, parentCtrl) {

      scope.addSubList = function() {
        var sublist = angular.element('<ul list>');
        element.find('a').append(sublist);
        $compile(sublist)(scope);
      };

    }
  };
});

看看这个笨蛋:http://plnkr.co/edit/dASASrFbtXSMCRZKRAj5?p=preview http://plnkr.co/edit/dASASrFbtXSMCRZKRAj5?p=preview

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular $compile 与所需的控制器 的相关文章

随机推荐