Question

我想知道如何使用ui-router和controllerAs语法将父状态的函数传递给子节点，这样我就可以调用父节点使用的函数。

一个例子是我有一个带有列表的视图，当我点击列表时，它会在子状态下加载细节，在更新子项时，使用父状态的函数更新/刷新列表。

我在这里做了一个plunkr： https://plnkr.co/edit/rRkibROTrXhkFSCuzcSb?p=preview

  .state('home.users', {
url: '/users',
templateUrl: 'users.html',
controller: function() {
  this.users = [
    { id: 1, name: 'User1'},
    { id: 2, name: 'User2'},
    { id: 3, name: 'User3'}];

  this.lastUpdated = new Date();
  this.updateList= function() {
    this.lastUpdated = new Date();
  }
},
controllerAs: 'usersVm' })

.state('home.users.details', {
url: '/:id',
templateUrl: 'usersdetails.html',
controller: function() {
  this.user = { id: 1, name: 'Users1' };
  this.update = function() {
    // update parent scope list here
    // usersVm.updateList();
    // $scope.$parent.usersVm.updateList()
  }
},
controllerAs: 'usersDetailsVm'

}）;

要解决我遇到的错误：点击Home.users.details.1，点击保存。我想保存按钮来调用更新父列表的父函数。如果不在任何地方使用$ scope（我试图避免使用），我无法让它工作。

我在想这个错吗？我应该采取另一种方式吗？

感谢。

Answer 1

在这种情况下使用$ scope可能没问题。如果我没有弄错的话，父函数应存储在$ scope.parent中。

但你不应该过度使用它。或者，您可以创建处理这些更新的服务。

需要角度ui-router子状态使用controllerAs语法调用父状态函数

1 个答案: