Question

是否可以手动重新编译嵌套在另一个指令中的指令？

我有一个modal-create-task指令，它使用showCreateTaskModal事件和一些数据进行初始化。根据事件附带的数据，模态更改其UI布局，并更改名为search-projects的嵌套指令的行为。

我目前遇到的问题是我需要重新编译search-directive，因为它需要使用showCreateTaskModal传入的数据。

这是模态模板的样子：

<div class="ui modal" id="modalCreateTask" ng-controller="ModalCreateTaskCtrl">

    <search-projects oo-filter="{{ mode }}" oo-subject="searchProjectSubject"></search-projects>

</div>

正如您所看到的，oo-filter和oo-subject属性都取决于附加到showCreateTaskModal事件的数据，但只有在编译器通过DOM后才会触发该事件。然后该指令无法访问所需的数据，因此它会回退到默认行为。

这是search-projects定义：

angular.module('app.ui.search.projects').directive('searchProjects', function(ConfigService)
{
    return {
        restrict : 'E',
        templateUrl : ConfigService.path.views + '/search/projects.html',
        scope : {
            filter : '@ooFilter',
            subject : '=ooSubject'
        }
    }
});

编辑1：

根据要求，我会尝试更好地解释我正在做的事情。

我有一个包含另一个指令的模态，该指令基于某些变量的内容，应该在属性发生变化时向服务器查询数据。

我想重新编译该指令，以便再次执行init()函数。

进行一些研究我也注意到可以使用$watch，但我不知道这是否是一个很好的解决方案。

Answer 1

指令很少需要重新编译。这可能表明方法或设计错误。

指令对数据做出反应。通常，数据通过属性，广播事件或与控制器的共享服务传递给指令。具体而言，隔离范围使用单向和双向数据绑定将数据传递给指令。

如果没有不同的触发器，可以$watch进行更改：

link: function(scope){
   scope.$watch("scopeVar", function(){
     // do something, like run init() again
   });
}

另一种选择是通过服务的直接触发，类似于Angular-UI $modal服务的工作方式。模态实例公开了一个方法，例如，从控制器中关闭模态（指令）：

modalInstance.close(result);

这个想法可以类似地用于触发使用相同服务的指令中的某些操作。

Answer 2

附上“＆n-if-if＆＃39;条件到你的搜索项目＆＃39;基于来自您的事件的数据的指令。所以你的代码可能如下所示：

<div class="ui modal" id="modalCreateTask" ng-controller="ModalCreateTaskCtrl">

    <search-projects oo-filter="{{ mode }}" oo-subject="searchProjectSubject"
      ng-if="dataComingFromEvent"></search-projects>

</div>

当数据在＆＃39;模型中可用时，该指令将再次放入DOM中。 viz＆quot; dataComingFromEvent＆＃39;因此你的指令将被重新编译。

重新编译AngularJS嵌套指令

2 个答案: