【问题标题】:data in $scope not loading in the view in angularjs for dynamically loaded html$scope中的数据没有加载到angularjs的视图中以动态加载html
【发布时间】:2017-11-25 04:30:19
【问题描述】:

我在标签中加载 HTML。在 div 中加载 HTML 后。我正在触发控制器。当控制器被触发时,我在控制器中有数据。该数据未填充到 HTML 视图中。有没有关于调用控制器或将数据加载到 HTML 中的建议??

 $('<div id = '+ createChannelTabId +'Properties'+ ' ng-controller="channelHomeCtrl" ng-bind="msg"> </div>').appendTo("#" + createChannelTabId);

        $('body').injector().invoke(function ($compile, $rootScope) {
                $compile($("#" + createChannelTabId + "Properties"))($rootScope);
                $rootScope.$apply();
            });
       var modalFieldProperties = $("#" + createChannelTabId + "Properties");
            modalFieldProperties.html(loadHTML("channelHome.html"));
            $("#" + createChannelTabId + "Link")[0].click();

         angular.bootstrap($("#" + createChannelTabId), ['ChannelModule']);

当控制器被调用时,我在控制器内执行此操作

    MDChannelModule.controller('channelHomeCtrl', function ($scope,$http) {
    debugger;
        MDBPMUtils.showWaitCursor();

                $scope.query = {};

                 $scope.queryBy = 'description';
        $scope.items =
            $http.get("/mondrestws/services/binData/getListOfBinDataHeaderWithAccessRights/",{params : {foreignKeyType:"channelJSon"} }).then(function(res){
                            debugger;
                            channelData = res.data;
                if(res.data.length > 0){
                                     document.getElementById("emptyDTImg").style.display = "none";

                            $scope.items = angular.fromJson(res.data); 

                                }else{
                                     $scope.items = {};
                                    document.getElementById("emptyDTImg").style.display = "inline";

                                }
                MDBPMUtils.showDefaultCursor();
            },
            function(data) {
                MDBPMUtils.showMessage(data.status,data);
            });
)}

即使这样,数据也没有加载到 HTML 中

<div ng-controller="channelHomeCtrl">
<div class="infobox infobox-green" id="{{i.binDataId}}" ng-click ="setSectedValue(i)" ng-style="{ 'width' : width}" style=" margin: 5px 5px 0px 5px; padding: 2px 3px 2px 9px; height: 55px; border: 1px solid; border-radius: 8px; " ng-repeat="i in items| filter:query" >
    <div class="infobox-icon">
        <img src="../images/system/decisionTree.png"></img>
    </div>
    <div class="infobox-data">
        <span class="infobox-data-number action-buttons">
            <a style="font-size: 18px;white-space: nowrap;width: 18em;overflow: hidden;text-overflow: ellipsis;" title="{{getChannelName(i)}}" href="#/channelList" ng-click="setLink(i)">{{getChannelName(i)}}</a>
        </span>
        <div class="infobox-content" style="font-size: 12px">
            <i class="fa fa-list-ol bigger-90 blue"></i> {{i.version}}
            <span style="font-weight: bold;">
                <i class="fa fa-clock-o bigger-130 blue"></i> {{i.binDataUpdateUserName}}
            </span> &nbsp;on {{i.binDataUpdatedOn}}
        </div>
    </div>
</div>
    </div>

【问题讨论】:

  • 您是否记录并检查了 angular.fromJson(res.data) 打印的内容以及响应 res.data
  • 我没有看到您的动态 HTML 中使用的项目。如果我错了,请纠正我
  • 是的@Crazy Mac res.data 很好,它给了我正确的数组
  • @Rohan kawade 我会把需要加载数据的动态html的内容贴出来
  • @AMITHGUJJAR 如果返回的对象是一个数组,你是在迭代并显示数组内的对象吗?另外,如果它只是一个数组,为什么要使用 angular.fromJson() ?

标签: html angularjs dynamic view scope


【解决方案1】:

从服务加载数据后,您可以在then 函数中尝试$scope.$apply()

$scope.items = angular.fromJson(res.data);
$scope.$apply();

【讨论】:

    猜你喜欢
    • 2014-06-18
    • 1970-01-01
    • 2013-05-11
    • 2013-04-16
    • 1970-01-01
    • 2015-06-02
    • 1970-01-01
    • 1970-01-01
    • 2015-01-23
    相关资源
    最近更新 更多