当模型通过$ resource加载时运行角度自定义指令

Question

我对角度自定义指令有以下问题。我有一个模式对话框，充满了输入元素。这些输入元素开始使用NG-重复角指令这样

  <div ng-repeat="item in params"> 
       <label>{{item.nombre}}{{item.valor}}</label> 
       <div class="input-group" ng-if="item.tipo=='DATE'"> 
        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
        <input type="text" name="{{item.nombre}}" class="form-control reportesFechas" ng-model="item.valor" 
          data-custom-datepicker data-date-format="dd/mm/yy" id="{{item.nombre}}"> 
       </div> 
      </div> 

数据自定义日期选择器填充是我的自定义属性。该PARAMS模型被通过服务调用填充到Java后端这样

  appbsReportsParamsService.query({ 
      q: "idReport="+id 
     }, function(data){ 
      $scope.params = data.content; 
     }) 

服务调用工程确定，因为最终的HTML是获取生成的输入条件“正确的”。但是数据自定义日期选择器没有得到应用。 这是正在生成的HTML“NG重复”部分：

<div class="input-group ng-scope" ng-if="item.tipo=='DATE'"> 
    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
    <input type="text" name="fecDesde" class="form-control reportesFechas hasDatepicker ng-pristine ng-valid ng-touched" ng-model="item.valor" data-custom-datepicker="" data-date-format="dd/mm/yy" id="fecDesde"> 
</div> 
<div class="input-group ng-scope" ng-if="item.tipo=='DATE'"> 
    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
    <input type="text" name="fecHasta" class="form-control reportesFechas hasDatepicker ng-pristine ng-valid ng-touched" ng-model="item.valor" data-custom-datepicker="" data-date-format="dd/mm/yy" id="fecHasta"> 
</div> 

所以基本上我想知道如何在异步服务调用后，应用指令来填充模型。

Answer 1

好的，问题是我在“编译”阶段下运行指令代码。我将其更改为“发布”阶段，现在一切正常。问题在于Angular工作流程（不是问题，但是我的错误观念在哪里）。这篇文章帮助我理解。

Angular directives - when and how to use compile, controller, pre-link and post-link

Answer 2

尝试在$ scope.params = data.content之后的服务成功调用中添加$ scope。$ apply（）。

因为你的params服务查询在Angular的$ scope之外运行，执行$ apply操作会强制更新$ scope。

看看是否有帮助。

appbsReportsParamsService.query({ 
    q: "idReport="+id 
}, function(data){ 
    $scope.params = data.content; 
    $scope.$apply(); 
});