Question

我使用angularjs ui-router 在应用中建立各种状态。虽然我知道我可以通过html中的链接进入状态（通过 ui-sref ），是否可以从控制器内进入状态？

下面的代码片段是一个简单的angularjs应用程序，以帮助说明我的观点。

在下面的示例中，我有两种状态：

有一个名为home的状态，它是一个包含文本输入字段的简单表单，以及一个在控制器中调用搜索功能的按钮。
有一个名为search的状态，它采用名为 text 的查询参数。其控制器调用基于文本执行搜索的服务。结果显示在页面上。

首先是模块的启动。

var app = angular.module('example', [
    'ui.router'
  ]);

以下是ui-routing状态的配置，如前所述。

app.config(
  function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/');
    $stateProvider.
      state('home', {
        url: '/',
        template: '<input ng-model="text" type="text" placeholder="Query Text">' +
          '<button type="button" ng-click="search()">Search</button>',
        controller: 'SearchFormController'
      }).
      state('search', {
        url: '/search?text',
        template: '<pre>{{results | json}}</pre>',
        controller: 'SearchController'
      });
  });

SearchFormController 控制搜索的表单输入。该控制器只是将表单输入转发到search状态。 是否可以引用搜索状态，而不是构建网址并调用 $ location.path ？

app.controller('SearchFormController', 
  function($scope, $location) {
    $scope.text = '';
    $scope.search = function() {
      // Can I use the 'search' state here instead of 
      // constructing a url and calling $location.path?
      $location.path('/search?text='+ encodeURIComponent($scope.text));
    };
  });

搜索控制器 SearchController ，如下所示。它需要stateParams（即查询参数）才能发出 $ http 调用。

app.controller('SearchController',
  function($scope, $stateParams, $http) {
    $scope.results = [];
    asUrl = function(resourceUrl, queryParams) {
      // do stuff and return http url
    };
    $http.get(asUrl("/someServiceUrl/search", $stateParams))
      .success(function(data, status) {
        $scope.results = data;
      })
      .error(function(data, status) {
        // display an error message
      });
  });

同样，在 SearchFormController 中，是否可以通过名称从配置中引用搜索状态？例如，在html页面中，我可以有这样的链接：<a ui-sref="search({text:Foo})">Search where text=Foo</a>其中search状态由名称引用并传入参数。是否可以从控制器调用类似的东西（按名称，传入参数）？

Answer 1

是的，请查看文档：{{3}} $state.go(stateName, params, options)

`go(to, params, options)`

转换到新状态的便捷方法。 $ state.go在内部调用$state.transitionTo，但会自动将选项设置为{ location: true, inherit: true, relative: $state.$current, notify: true }。这允许您轻松使用绝对路径或相对路径，并仅指定您要更新的参数（同时让未指定的参数从当前活动的祖先状态继承）。

我们可以使用许多设置，但所有设置都在上面的doc linke中明确定义

也可能很有趣：

<强> http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state

从控制器内调用angularjs ui-router状态

1 个答案:

`go(to, params, options)`