【问题标题】:AngularJS: pass parameter between controllersAngularJS:在控制器之间传递参数
【发布时间】:2015-12-21 23:47:53
【问题描述】:

我想要做什么:

我有一个 ListView(或者更确切地说是一个手风琴),其中包含多个项目(为简单起见,假设它们具有唯一的 idname)。对于每个项目,我想包含一个指向详细视图的链接,以显示和编辑该项目的属性(id 除外)。

谷歌搜索会返回几个结果,例如:Passing data between controllers in Angular JS?

据我了解,建议的解决方案包括:

ng-init:(见Can you pass parameters to an AngularJS controller on creation?

我可以使用ng-repeat 内部的ng-init 为列表中的每个项目初始化一个参数。然而,到目前为止,角度文档建议不要这样做:

ngInit 的唯一适当用途是为 ngRepeat 的特殊属性设置别名,如下面的演示所示。除了这种情况,您应该使用控制器而不是 ngInit 来初始化作用域上的值。

服务

建议使用服务在控制器之间共享全局变量。我已经通过使用服务来保存我的项目列表并使用对服务的调用来添加/删除或更改项目。我还实现了一个getItem(id) 方法,我想从我的详细视图的控制器中调用它。但要做到这一点,我需要先知道项目的 id!

通过$routeParams传递值

Angular Phonecat Tutorial 通过$routeParams 传递参数解决了类似的问题。虽然这可行,但这意味着我必须在详细视图的链接中包含我的项目的id。用户可以轻松更改链接并最终进入完全不同项目的详细视图。如果可能的话,我宁愿不在我的详细视图链接中公开内部id


这似乎是一个很常见的要求。有没有我遗漏的最佳实践?

【问题讨论】:

  • “用户可以轻松更改链接并最终进入完全不同项目的详细视图”这听起来像是默默无闻的安全性。远离那个!我建议使用 $routeParams 和 service 的组合。
  • 你有没有想过从第一个控制器监听创建事件$on并将数据作为参数绕过到第二个控制器?
  • @julmot 我不太明白你的意思。加载我的第一个控制器时,我加载了一个包含所有项目的列表。对于每个项目,我需要一个指向详细信息页面的单独链接,该链接也将id 作为参数传递。所以我的问题保持不变:我实际上如何将参数传递给第二个控制器?
  • @jao:谢谢,我目前正在实施这个。我只是想知道这是否真的是要走的路,并感谢任何其他建议。
  • 如果没有实际代码,问题就太模糊了。没有“最佳”,它始终取决于实际代码和偏好。

标签: javascript html angularjs


【解决方案1】:

你有两个真正的选择(你已经确定):

  • 使用服务
  • 将信息作为 url 的一部分传递

两者在技术上都是正确且可行的,但从语义和状态的角度来看,我的偏好是使用 url。

由于您提供的是可点击链接,因此您链接到可链接的内容(即可以通过唯一 url 识别的项目或状态)是有意义的。如果您认为打开的手风琴项更像是状态项(而不是页面),那么您可以查看 ui-router:https://github.com/angular-ui/ui-router

我不确定您为什么反对在 url 中包含项目 ID。毕竟,任何感兴趣的人都可以使用开发人员工具在 UI 中看到任何信息。如果您不想在 UI 中显示数据库架构信息,那么可以使用各种 ID 混淆方法来解决这个问题。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-07-22
    • 2013-07-30
    • 1970-01-01
    • 2014-05-03
    • 1970-01-01
    • 2016-03-02
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多