Question

我需要在角度1.6。*中使用来自控制器的指令。

我用代码更好地解释。

控制器

$scope.directive = [
   "<span my-directive></span>",
   "<span my-directive2></span>",
   "<span my-directive3></span>"
]

HTML

<div>{{directive}}</div>

我的解决方案是：

控制器

directive.forEach(function (item) {
    $compile(item)($scope).appendTo('.navbar');
})

HTML

<div class="navbar"></div>

但是我的解决方案依赖于DOM，这是一个糟糕的解决方案我需要一个聪明的解决方案。

有什么想法吗？

谢谢！

Answer 1

您可以创建自己的指令，与ng-bind和ng-bind-html类似，为您执行此绑定。

请考虑以下示例：

<强>指令

function MyBindCompileDirective($compile) {
    return {
        restrict: 'A',
        link(scope, elem, attrs) {
            attrs.$observe('myBindCompile', () => elem.html($compile(scope.myBindCompile)(scope).html()))
        }
    };
}

angular
    .module('app')
    .directive('myBindCompile', MyBindCompileDirective);

HTML中的使用

<div ng-repeat="item in directives" my-bind-compile="item"></div>

Answer 2

我会在ngRepeat中迭代并直接放置指令，只更改所需内容。集合在控制器中定义

<div ng-repeat="model in collection">
 <span my-directive variable="model"></span>
</div>

AngularJS使用来自控制器的指令

2 个答案: