在动态html加载时访问ng-repeat中的元素

时间:2015-06-25 09:16:50

标签: angularjs angularjs-ng-repeat

我正在尝试使用http get请求访问dymanic加载的HTML中的DOM元素。我在控制器中使用的代码是

$http.get("/ProjectManager/Edit?id=" + requestId).success(function (data, status, headers, config) {
        data = data.trim();
        var newDirective = angular.element(data);
        angular.element(document.getElementById("editDiv")).html(newDirective);
        $compile(newDirective)($scope);
        var resources = angular.element(document.getElementById("projectResources")).val();
            for (var i = 0; i < resources.length; i++) {
                var resourceData = new ProjectResourcesModel(resources[i].ResourceID, resources[i].ProjectResourceID, resources[i].Employee, resources[i].IsApprover, resources[i].StartDate,
                    resources[i].EndDate)
                $scope.resource.push(resourceData);
                //$scope.$apply();
                var id = "startDate" + resources[i].ResourceID;
                angular.element(document.getElementById(id)).datetimepicker({
                    defaultDate: resources[i].StartDate,
                    format: 'MM/DD/YYYY',
                })
            }
    })

我正在尝试访问具有特定id的元素,该元素存在于我的数组元素中。

在ng-repeat中查看HTML如下

 <div>
 <div class="form-group">
 <div class='input-group date' id='startDate{{item.ResourceID}}'>
 <span class="input-group-addon">
 <span class="glyphicon glyphicon-calendar"></span>
 </span>
 <input ng-model="item.StartDate" type='text' id="txtStartDate{{item.ResourceID}}" class="form-control" />
 </div>
 </div>
 </div>
 </div>

我必须将bootstrap datetimepicker附加到文本框中,因此我想访问ng-repeat中的div,其内部的ID由ng-repeat数组存在。 但是当我在获取请求成功时访问具有该id的项目时,我没有获得该元素。例如,在视图绑定之后,div的id将是startDate151。

所以我尝试使用$ scope。$ apply(),我可以将datepicker附加到ng-repeat中的元素但是我开始收到控制台错误

Error: [$rootScope:inprog] $digest already in progress

任何人都可以帮我解决这个问题,或者我可以在这种情况下使用其他替代方案。

0 个答案:

没有答案