返回状态时,$scope 何时重新加载?
When returning to a state, when does $scope reload?
我在这个控制器的父状态中有一个 list
对象。每次我加载使用这个控制器的状态时,$scope.items
被清空并且控制器必须再次从父作用域加载数据。
ListCtrl
对应list
状态。父状态包含许多列表。
.controller('ListCtrl', ['$scope','$state','$timeout',
function($scope, $state, $timeout) {
console.log($scope.items); // undefined
if(!$scope.items) { // always evaluates to true
$timeout(function() {
$scope.items = $scope.$parent.list.items;
}, 500);
} else {
console.log($scope.items); // never executes here
}
}])
据我了解,AngularJS 默认情况下会缓存一些视图。这是否意味着缓存不适用于缓存视图中的范围变量?最重要的是,有没有办法缓存这个$scope.items
,这样每次我return到这个状态,就没有这个超时延迟了?
作为AngularJS的初学者,我的理解是$scope.items只定义在当前控制器内部。如果您想在 html 内容中加载项目,只需在指定的 html 标签中使用的控制器下定义项目。
我编了一个toy example,
angular.module('scopeExample', [])
.controller('MyController', ['$scope', function($scope) {
$scope.username = 'World';
}]);
这与 AngularJS Scope documentation 上的类似。
父控制器
.controller('parentController', ['$scope','$state','$timeout','$rootScope'
function($scope, $state, $timeout, $rootScope) {
$rootScope.items=['item 1','item 2'];
}])
另一个控制器
.controller('ListCtrl', ['$scope','$state','$timeout','$rootScope'
function($scope, $state, $timeout,$rootScope) {
console.log($rootScope.items); // Should give the result
if(!$scope.items) { // always evaluates to true
$timeout(function() {
$scope.items = $scope.$parent.list.items;
}, 500);
} else {
console.log($scope.items); // never executes here
}
}])
不要忘记在顶部添加 $rootScope。
最终解决方案是检查 $rootScope.list.item 是否已加载,而不仅仅是 $scope.item.
if(!$rootScope.list) {
$timeout(function() {
$scope.items = $rootScope.list.items;
}, 1000);
} else {
$scope.items = $rootScope.list.items;
}
我在这个控制器的父状态中有一个 list
对象。每次我加载使用这个控制器的状态时,$scope.items
被清空并且控制器必须再次从父作用域加载数据。
ListCtrl
对应list
状态。父状态包含许多列表。
.controller('ListCtrl', ['$scope','$state','$timeout',
function($scope, $state, $timeout) {
console.log($scope.items); // undefined
if(!$scope.items) { // always evaluates to true
$timeout(function() {
$scope.items = $scope.$parent.list.items;
}, 500);
} else {
console.log($scope.items); // never executes here
}
}])
据我了解,AngularJS 默认情况下会缓存一些视图。这是否意味着缓存不适用于缓存视图中的范围变量?最重要的是,有没有办法缓存这个$scope.items
,这样每次我return到这个状态,就没有这个超时延迟了?
作为AngularJS的初学者,我的理解是$scope.items只定义在当前控制器内部。如果您想在 html 内容中加载项目,只需在指定的 html 标签中使用的控制器下定义项目。
我编了一个toy example,
angular.module('scopeExample', [])
.controller('MyController', ['$scope', function($scope) {
$scope.username = 'World';
}]);
这与 AngularJS Scope documentation 上的类似。
父控制器
.controller('parentController', ['$scope','$state','$timeout','$rootScope'
function($scope, $state, $timeout, $rootScope) {
$rootScope.items=['item 1','item 2'];
}])
另一个控制器
.controller('ListCtrl', ['$scope','$state','$timeout','$rootScope'
function($scope, $state, $timeout,$rootScope) {
console.log($rootScope.items); // Should give the result
if(!$scope.items) { // always evaluates to true
$timeout(function() {
$scope.items = $scope.$parent.list.items;
}, 500);
} else {
console.log($scope.items); // never executes here
}
}])
不要忘记在顶部添加 $rootScope。
最终解决方案是检查 $rootScope.list.item 是否已加载,而不仅仅是 $scope.item.
if(!$rootScope.list) {
$timeout(function() {
$scope.items = $rootScope.list.items;
}, 1000);
} else {
$scope.items = $rootScope.list.items;
}