ui-sref でパラメータを渡し、コントローラで取得する方法は?

ui-sref を使用したパラメーターの受け渡しとコントローラーでの取得

問題

ui-sref と を使用して 2 つのパラメーターを状態に渡す必要があります。状態コントローラーでアクセスします。ただし、コントローラで未定義のパラメータ値に関する問題が発生します。

解決策

ui-sref でパラメータを渡し、コントローラでパラメータを取得するには、次の手順に従います。

1. 状態定義の更新:

$stateProvider
    .state('home', {
      url: '/:foo?bar', // Define parameter placeholders in the URL
      views: {
        '': {
          templateUrl: 'home.html',
          controller: 'MainRootCtrl'
        },
        ...
      }
    });

2. コントローラーで $stateParams を使用:

.controller('MainRootCtrl', function($scope, $state, $stateParams) {
    var foo = $stateParams.foo; // Access fooVal
    var bar = $stateParams.bar; // Access barVal
})

詳細なパラメータの設定

URL パラメータのプレースホルダに加えて、状態定義の params オブジェクトを使用して詳細なパラメータを定義することもできます。

.state('other', {
    url: '/other/:foo?bar',
    params: {
        foo: {
          value: 'defaultValue',
          squash: false,
        },
        bar: {
          array: true,
        },
        hiddenParam: 'YES',
      }
    ...

使用例

ui-sref を使用してパラメーターを渡し、更新された状態定義でパラメーターを取得するには:

<a ui-sref="home({foo: 'fooVal1', bar: 'barVal1'})"></a>
<a ui-sref="home({foo: 'fooVal2', bar: 'barVal2'})"></a>

パラメーター構成オプション

params オブジェクトの設定には次のものが含まれます:

• value: デフォルトのパラメーター値を指定します。
• array: パラメーターを配列として扱います。
• squash: 方法を構成しますデフォルトのパラメータ値は URL で表されます。

詳細については、URL パラメータと $stateProvider に関する ui-router ドキュメントを参照してください。

以上がui-sref でパラメータを渡し、コントローラで取得する方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。