Question

我正在加载一个将近19,000行的JSON ...最小化为大约240k的一行。我正在通过index.html文件将其作为全局变量加载到我的应用中：

<script type="text/javascript" src="js/cdjson.js"></script>

var _countries = {
   "country": {
      "USA": {
         "currency": {
            "currencyCode":["USD"],
                "currencyName":["United States Dollar"],
                "currencySymbol":["&#36;"]
         },
         "info": { 
               ...
               ...
         },
         "phone" : {
               ...
         },
         "postal" : {
               ...
         }
      },
      "CAN" : {
         ...
      }
   }
}

在控制器中将其分配给$ scope变量$scope.countries = _countries.country ;。但是，当该控制器的html DOM在对象完全加载到$ scope中之前加载其试图访问$ scope变量的尝试时，会导致诸如Cannot read property 'country' of undefined之类的JS对象错误。

如何在$ scope对象完全加载之前阻止页面呈现？ $ scope国家对象正在<select ng-repeat="countries as country">

中使用

Answer 1

具有一个标志，指示何时将数据完全加载到控制器。

<select ng-if="countries.length" ng-repeat="countries as country">

Answer 2

理想情况下，应该在HTML末尾加载js文件，这样就不会出现此问题。但是，如果那不是您的选择，则将其添加到您的控制器中

$scope.countries = []
angular.element(document).ready(function () {
    $scope.countries = _countries.country;
});

和您的HTML

<select ng-if="countries.length" ng-repeat="countries as country">

如何防止在对象完全加载到$ scope中之前加载DOM？

2 个答案: