javascript - 在页面模板中使用 Angular ui-router State

Question

是否可以在 View 中使用 ui-router 的 $stateProvider 中定义的状态？

例如我的状态如下所示:

$stateProvider
  .state('peoplelist', {
      template: '<people></people>',
  })

我的 HTML 是这样的:

<div class="header">
  <button ng-click="updateList()"></button>
</div>

<!-- peoplelist view to go here-->

<div class="footer">...</div>

我的 Controller 中也有这个，我希望 $state.go 仅重新加载 peoplelist 状态，而不是整个页面。

vm.updateList = function() {
  $state.go($state.current, {}, { reload: 'peoplelist' });
}

这在 Angular 中可能吗？

感谢任何帮助。提前致谢!

Answer 1

您可以为 peopleList 状态创建一个单独的 Controller ，并在状态定义中将其提及为:

$stateProvider
  .state('peoplelist', {
      template: '<people></people>',
      controller: 'peopleListController'
  })

在你的 peopleListController 中你可以做

$state.reload()

重新加载该状态

另外，如果你想从另一个状态导航到这个状态，你可以使用 $state.go :

$state.go('peopleList')

它只会根据您的状态定义加载 peopleList Controller 。

您还可以将参数传递给 $state.go 并将它们传递给您的状态定义。

您可以在 Controller 中使用 $stateParams 访问它们。