123

AngularJS v1.2.0-rc.2 と ui-router v0.2.0 を使用しています。リファラーの状態を別の状態に渡したいので、toParamsof を次の$state.goように使用します。

$state.go('toState', {referer: $state.current.name});

docsによると、これは$stateParamsコントローラtoStateに を設定する必要がありますが、そうですundefined。私は何が欠けていますか？

実演するためにプランクを作成しました：

http://plnkr.co/edit/ywEcG1

4

14 に答える 14

148

URL 以外の状態を渡したい場合はurl、state. 私はPRで答えを見つけ、よりよく理解するためにいくつかのモンキーをしました。

$stateProvider.state('toState', {
  templateUrl:'wokka.html',
  controller:'stateController',
  params: {
    'referer': 'some default', 
    'param2': 'some default', 
    'etc': 'some default'
  }
});

次に、次のようにナビゲートできます。

$state.go('toState', { 'referer':'jimbob', 'param2':37, 'etc':'bluebell' });

または：

var result = { referer:'jimbob', param2:37, etc:'bluebell' };
$state.go('toState', result);

したがって、HTMLでは次のようになります。

<a ui-sref="toState(thingy)" class="list-group-item" ng-repeat="thingy in thingies">{{ thingy.referer }}</a>

この使用例はドキュメントで完全に明らかにされていますが、URL を使用せずに状態を遷移させる強力な手段だと思います。

于 2014-05-29T18:38:11.437 に答える
15

このページのこれらの例はどれもうまくいきませんでした。これは私が使用したもので、うまく機能しました。一部のソリューションでは、url を $state.go() と組み合わせることはできないと言われていますが、これは正しくありません。扱いにくいのは、URL のパラメーターを定義し、パラメーターをリストする必要があることです。両方が存在する必要があります。Angular 1.4.8 および UI Router 0.2.15 でテスト済み。

状態で、パラメーターを状態の最後に追加し、パラメーターを定義します。

url: 'view?index&anotherKey',
params: {'index': null, 'anotherKey': null}

コントローラーでは、go ステートメントは次のようになります。

$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' });

次に、パラメーターを引き出して、新しい状態のコントローラーで使用します(コントローラー関数に $stateParams を渡すことを忘れないでください)。

var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
console.log(anotherKey); //it works!
于 2016-01-12T16:58:15.287 に答える
11

私の場合、ここに記載されているすべてのオプションを試しましたが、適切に機能するものはありませんでした (angular 1.3.13、ionic 1.0.0、angular-ui-router 0.2.13)。解決策は次のとおりです。

.state('tab.friends', {
      url: '/friends/:param1/:param2',
      views: {
        'tab-friends': {
          templateUrl: 'templates/tab-friends.html',
          controller: 'FriendsCtrl'
        }
      }
    })

そしてstate.goで：

$state.go('tab.friends', {param1 : val1, param2 : val2});

乾杯

于 2015-07-03T05:44:16.457 に答える
6

私は同様の問題に直面していました。多くのグーグルと試行錯誤の末、実用的なソリューションにたどり着きました。これがあなたのために働く私の解決策です。

searchBoxControllerとstateResultControllerの2 つのコントローラーと、検索ボックスを持つビューからリモート サーバーからフェッチされた結果を表示するビューに渡されるsearchQueryという名前のパラメーターがあります。これはあなたがそれを行う方法です：

以下は、次のビューを呼び出すコントローラーです。$state.go()

.controller('searchBoxController', function ($scope, $state) {
        $scope.doSearch = function(){
            var searchInputRaw = $scope.searchQueryInput;
            $state.go('app.searchResults', { searchQuery: searchInput });
        }
    })

以下は、$state.go()gets が実行されたときに呼び出される状態です。

.state('app.searchResults', 
            {
                url: '/searchResults',
                views:
                {
                    'menuContent': { templateUrl: 'templates/searchResult.html', controller: 'stateResultController' }
                },
                params: 
                {
                    'searchQuery': ''
                }
            })

最後に、状態に関連付けられたコントローラーapp.searchResults:

.controller('stateResultController', function ($scope, $state, $stateParams, $http) {
        $scope.searchQueryInput = $stateParams.searchQuery;
    });
于 2017-02-07T06:08:21.043 に答える
3

私の場合、親子状態です。子状態で宣言されたすべてのパラメーターは、親状態によって認識される必要があります

        .state('full', {
            url: '/full',
            templateUrl: 'js/content/templates/FullReadView.html',
            params: { opmlFeed:null, source:null },
            controller: 'FullReadCtrl'
        })
        .state('full.readFeed', {
            url: '/readFeed',
            views: {
                'full': {
                    templateUrl: 'js/content/templates/ReadFeedView.html',
                    params: { opmlFeed:null, source:null },
                    controller: 'ReadFeedCtrl'
                }
            }
        })
于 2016-05-02T04:13:54.260 に答える
2

2 つのパラメーターを受け取る状態を持つようになった解決策は、次のように変化していました。

.state('somestate', {
  url: '/somestate',
  views: {...}
}

に

.state('somestate', {
  url: '/somestate?id=:&sub=:',
  views: {...}
}
于 2015-01-20T22:51:24.127 に答える
1

ページ 1 から 2 に移動しようとしていて、いくつかのデータも渡す必要がありました。

私のrouter.jsでは、params nameとageを追加しました:

.state('page2', {
          url: '/vehicle/:source',
          params: {name: null, age: null},
.................

Page1で、次のボタンの onClick :

$state.go("page2", {name: 'Ron', age: '20'});

Page2では、これらの params にアクセスできました:

$stateParams.name
$stateParams.age
于 2019-02-15T09:17:51.650 に答える
0

これが次のように渡したいクエリ パラメータの場合: /toState?referer=current_user

次に、次のように状態を説明する必要があります。

$stateProvider.state('toState', {
  url:'toState?referer',
  views:{'...'}
});

ソース: https://github.com/angular-ui/ui-router/wiki/URL-Routing#query-parameters

于 2015-07-09T17:03:19.630 に答える