Javascript angularjs-阵列已更新,但在使用ui路由器时视图未更新
我使用Javascript angularjs-阵列已更新,但在使用ui路由器时视图未更新,javascript,angularjs,Javascript,Angularjs,我使用ui路由器根据需要路由到特定子页面: var myApp = angular.module("myApp",['ui.router']); myApp.config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('usergroups', { url: "/usergroups", templateUrl: "pages/usergroups.html", contro
ui路由器
根据需要路由到特定子页面:
var myApp = angular.module("myApp",['ui.router']);
myApp.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('usergroups', {
url: "/usergroups",
templateUrl: "pages/usergroups.html",
controller : 'UsergroupsCtrl'
})
.state('usergroups.create', {
url: "/create",
templateUrl: "pages/usergroups.new.html",
controller : 'UsergroupsCtrl'
})
...
这是我的usergroups.html
:
<body>
<h3>User Groups</h3><br/>
<button class="fon-btn" type="button" ng-hide = "toAdd" ng-click="toAdd = true" ui-sref="usergroups.create">Create New Group</button>
<div ui-view></div>
<ul>
<li class="bitcard padding10" ng-repeat="group in usergroups">
<span class="padding10"><strong>{{group.name}}</strong></span>
</li>
</ul>
</body>
<body>
<form ng-submit="add()">
<input class="btn" type="submit" value="Add Usergroup"><br/><br/>
</form>
</body>
当我单击addusergroup
时,它将从UsergroupsCtrl
调用Add()
:
$scope.add = function() {
$scope.usergroups.push({name:$scope.name});
console.log($scope.usergroups);
}
控制台显示,$scope.usergroups
已更新。但是在usergroups.html
:ng repeat=“group in usergroups”
中没有更新视图。我添加了$scope.$apply()
和$scope.$digest()
但出现错误:
$apply已在进行中
但如果我不使用
ui路由器
,一切都会正常工作。如何解决此问题?我认为相同的$scope
不能在两个不同的控制器中使用。您可以将其更改为$rootScope。比如$rootScope.usergroups.push()
。这可能对你有帮助。您还可以使用$stateParam
不要认为控制器UsergroupsCtrl
在父路由和子路由之间共享。控制器会在每次路由更改时刷新。为什么不尝试创建一个服务,以便在不同的控制器之间共享数据。我遇到一个错误:错误:找不到变量:$stateparm
您必须插入$stateParams,然后才能使用它。你看过ui路由器文档了吗?给你