Question

主要问题：是否可以将$state.go()与$location.search(e,v)填充的自定义搜索元素一起使用？或者我每次想要进行此类转换时都需要使用$location.path()？

为什么我需要它：我有一个视图，有一些选择（所有这些都有一个默认的空值），如果这些选择的每个更改都会改变位置（fe列表的合作伙伴），那就太好了/partners/list?branch=branch01&role=seller）。但是通过使用$state.go()，我只能使用$stateParams（在状态URL中定义） - 但这并不能满足我的要求，我希望有一个将状态直接更改为f.e的操作。 /partners/list?role=seller。

我希望解决方案使用$location.search(e,v)，因为所有参数都是可选的，因此我无法准备可以采用任何搜索参数集的状态。

Answer 1

您可以使用.go()

应用搜索元素

// Here's a skeleton app.  Fork this plunk, or create your own from scratch.
var app = angular.module('demonstrateissue', ['ui.router']);

app.config(function($stateProvider) {
  $stateProvider.state({ 
    name: 'home', 
    url: '/home?param1&param2', 
    controller: function($scope, $stateParams, $state) {
      $scope.$stateParams = $stateParams;
    }, 
    template: 'state params: <pre>{{ $stateParams | json }}</pre>'});
});


// Adds state change hooks; logs to console.
app.run(function($state, $rootScope, $location) {
      $rootScope.someparams = function() { $state.go('home', { param1: 'foo', param2: 'bar' }); };
      $rootScope.otherparams = function() { $state.go('home', { param1: 'wat', param2: 'oy!' }); };
      $rootScope.location = $location.url;
      $rootScope.$on('$locationChangeSuccess', function(evt, extra) { 
$rootScope.location = extra;
        });
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
        <script src="https://rawgit.com/angular-ui/ui-router/0.2.11/release/angular-ui-router.js"></script>
    <body ng-app="demonstrateissue">
      <a href="#" ng-click="someparams()">Some params</a>
      <a href="#" ng-click="otherparams()">Other params</a>
      <div ui-view>
        ui-view not populated
      </div>  
      <pre>{{ location }}</pre>
    </body>

具有搜索元素的角度ui路由器状态

1 个答案: