通过$ resource

时间:2015-07-18 22:03:36

标签: javascript html angularjs angularjs-directive

我有角度自定义指令的以下问题。我有一个模态对话框,填充输入元素。这些输入元素使用ng-repeat angular指令填充,如下所示

            <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>

data-custom-datepicker 是我的自定义属性。 params 模型通过服务调用填充到像这样的

这样的java后端
         appbsReportsParamsService.query({
            q: "idReport="+id
        }, function(data){
            $scope.params = data.content;
        })

服务调用工作正常,因为最终的HTML在输入生成方面是“正确的”。但是, data-custom-datepicker 无法应用。 这是生成的HTML“ng-repeat”部分:

<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>

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

2 个答案:

答案 0 :(得分:0)

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

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

看看是否有帮助。

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

答案 1 :(得分:0)

好的,问题是我在&#34;编译&#34;下运行了指令代码。相。我将其更改为&#34; post&#34;阶段,现在一切正常。问题是Angular工作流程(不是问题,而是我误解的地方)。这篇文章帮助我理解。

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