如何使用 ui-sref 傳遞參數並在控制器中檢索它們？

使用ui-sref 傳遞參數並在控制器中檢索

問題

您需要使用ui-sref 和將兩個參數傳遞給狀態在狀態控制器中存取它們。但是，您在控制器中遇到未定義參數值的問題。

解決方案

要使用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
})

粒徑參數配置

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

粒徑參數配置

粒徑參數配置

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

除了URL 參數佔位符之外，您還可以使用狀態定義中的params 物件來定義粒度參數：

用法範例

要使用ui-sref傳遞參數並使用更新的狀態定義檢索它們：
• 參數配置選項
• params 對象設置包括：
• value: 指定預設參數值。

array:

將參數視為陣列。

squash: 配置方式預設參數值在 URL 中表示。 有關詳細信息，請參閱有關 URL 參數和 $stateProvider 的 ui-router 文件。

以上是如何使用 ui-sref 傳遞參數並在控制器中檢索它們？的詳細內容。更多資訊請關注PHP中文網其他相關文章！