javascript - AngularJS:在 Controller 之间传递参数

Question

我正在尝试做什么:

我有一个 ListView(或者更确切地说是一个 Accordion )，其中包含多个项目(为简单起见，我们假设这些项目具有唯一的 id 和 name)。对于每个项目，我想包含一个详细 View 的链接，以显示和编辑该项目的属性(id 除外)。

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

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

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

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

The only appropriate use of ngInit for aliasing special properties of ngRepeat, as seen in the demo below. Besides this case, you should use controllers rather than ngInit to initialize values on a scope.

服务:

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

通过$routeParams传递值

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

<小时/>

这似乎是一个很常见的要求。我是否缺少任何最佳实践？

Answer 1

您有两个真正的替代方案(您已确定):

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

两者在技术上都是正确且可行的，但从语义和状态的 Angular 来看，我更倾向于使用 url。

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

我不确定您为什么不喜欢在网址中包含项目 ID。毕竟任何感兴趣的人都可以使用开发人员工具查看 UI 中的任何信息。如果您不想在 UI 中显示数据库架构信息，则可以使用各种 ID 混淆方法来解决此问题。