如何访问状态参数（ui-sref）而不将它们包含在angularjs中状态的URL属性中

Posted 2023-03-05

【中文标题】如何访问状态参数（ui-sref）而不将它们包含在angularjs中状态的URL属性中

【英文标题】：How to access state params (ui-sref) without including them in URL propery of state in angularjs

【发布时间】：2015-02-14 10:29:01

【问题描述】：

This question is might be similar to this but with different requirements。由于我无法发表评论（需要 50 分），我正在复制这个问题。

我想简单地访问从控制器内部模板中的 ui-sref 发送的参数，而不在状态 URL 中提及它们。

类似于使用下面的链接通过 foo 和 bar 参数将状态转换为 home：

<a ui-sref="home(foo: 'fooVal', bar: 'barVal')">Go to home state with foo and bar parameters </a>

在控制器中接收 foo 和 bar 值：

state('home', 
      url: '/:foo',
      views: 
        '***whatIsThis***': 
          templateUrl: 'home.html',
          controller: 'MainRootCtrl'    
        ,

    app.controller('SomeController', function($scope, $stateParam) 
      //..
      var foo = $stateParam.foo; //getting fooVal
      var bar = $stateParam.bar; //getting barVal
      //..
    );     

控制器中的 $stateParam 未定义。

有人可以帮助我了解如何完成它吗？我也想获得 bar 而不将其添加到 URL

【问题讨论】：

服务的名称是$stateParams（不是$stateParam）。如果要定义不会出现在 URL 中的其他参数，请使用 params 配置 (see documentation)。请查看文档并删除问题。

How to pass parameters using ui-sref in ui-router to controller 的可能副本

@hon2a：谢谢伙计，但我在使用它们时收到错误“状态中的无效参数”。你能提供一个样本吗（谷歌它但找不到，对不起，我是 AngularJs 的新手，所以可能会用错误的关键字搜索或......）我正在尝试从 sref 发送到参数，如问题所示，并尝试捕获一个使用 params 属性在 URL 中未提及并抛出上述错误。

【参考方案1】：

如果您的某些参数不应该出现在 URL 中，您需要结合 url 和 params：

.state('home', 
    url: '/:foo',
    params: 
        foo: 'default value of foo',
        bar: 'default value of bar'
    ,
    ...
)

然后正确使用$stateParams：

.controller('SomeController', ['$scope', '$stateParams', function ($scope, $stateParams) 
    // ... (use $stateParams)
])

(see documentation).

---

如果您仍然遇到问题，请查看此working codepen demo。

【讨论】：

正确。我们状态配置的params 选项似乎是一个巨大的飞跃...... ;)

@hon2a：嘿，伙计，您花时间提供答案，但让我解释一下我的要求，正如我在问题中提到的，我想在 ui- 中发送 2 个参数sref 和这两个中的一个将显示在 url 中，另一个将在我的控制器中使用，根据我的理解，当我们使用参数时： 如果未检索到，其主体内提供的值将被替换为状态参数所以我不希望它们被初始化为一些值，但是如果我们为了将它们注入 $stateParams 而提到它们，那么我会收到以下错误

错误：状态“homezChild”中的参数无效

我的回答显示了如何拥有一个具有 2 个参数的状态，其中只有一个显示在 URL 中。请研究答案和链接的文档并尝试创建解决方案。 (This is not a "debug my code for me" site.) 如果您无法完成，请编辑问题或创建一个新问题。

@hon2a：谢谢伙计，我不是要调试我的程序；），我只是想说状态的“参数”属性可能存在一些问题..我只是想在我的实际应用程序中使用它之前在一个 2 页应用程序中使用它并得到那个错误......我正在做的事情是从 ui-sref 传递给 param 和 rest 是你的状态配置，它也在你提供的文档中，但是它根本连导航都没有:(