Question

在将数据插入$ scope后需要显示html模板。代码如下。这是工作。

var b2buiDemo = angular.module('b2buiDemo', [...]);

b2buiDemo.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/exthtlcd', {
        templateUrl: 'partials/exthtlcd-list.html',
        controller: 'ExternalHotelCodeListCtrl',
        resolve:{list:function(ExternalHotelCodeRestClient){
          return ExternalHotelCodeRestClient.getPage();
        }}
      }).     
      otherwise({
        redirectTo: '/exthtlcd'
      });
  }]);

b2buiDemo.run(['$rootScope', function($root) {
  $root.$on('$routeChangeStart', function(e, curr, prev) { 
    if (curr.$$route && curr.$$route.resolve) {
      // Show a loading message until promises aren't resolved
      $root.loadingView = false;
      console.log("HIDE");
    }
  });
  $root.$on('$routeChangeSuccess', function(e, curr, prev) { 
    // Hide loading message
    $root.loadingView = true;
    console.log("SHOW");
  });
}]);

var externalHotelCodeCtrls = angular.module('externalHotelCodeCtrls', []);


externalHotelCodeCtrls.controller('ExternalHotelCodeListCtrl',['$scope', 'list', 
  function($scope,list){
    console.log("FILL SCOPE 1");
    $scope.list=list.data;
    console.log("FILL SCOPE 2");
  }]);

var externalHotelCodeRestClientServices = angular.module('externalHotelCodeRestClientServices', []);

externalHotelCodeRestClientServices.factory('ExternalHotelCodeRestClient',['$http','$q',function($http,$q){

    return{
        getPage: function(){
            var promise = $http.get('***');
            promise.success(function(data){
                console.log('SUCCESS');
                console.log(data);
                return data;
            });
            return promise;             
        }
    }
}]);

exthtlcd-list.html

<div ng-show='loadingView'>...</div>

看起来一切都很好。不显示空模板。

但是看看控制台输出： HIDE＆gt;＆gt;成功＆gt;＆gt; SHOW＆gt;＆gt;填写范围1＆gt;填写范围2

看似在解析promise之后但在数据插入范围之前显示html。可以吗？不，怎么修好？

Answer 1

由于angularjs严格的双向绑定，这并没有给你带来任何问题。事实是，当承诺被解决时，它被称为回调，它首先被称为div并显示div。

请注意，如果您使用的是双花括号绑定，则可以使用{{youvar}}之类的内容进行闪烁。要避免此问题，请改用ng-bind。

AngularJS。 NG-表演。数据加载到$ scope后显示html

1 个答案: