javascript - 如何将数据从一个 Controller 传递到服务并在同一事件中访问其他 Controller 上的数据?

标签 javascript angularjs prototype prototypal-inheritance

我在尝试使用我的服务将数据从一个 Controller 传递到另一个 Controller 时遇到一些问题。

我一直在 Controller 中使用 $rootScope 实现原型(prototype)继承并广播该对象,以便我可以在其他 Controller 中访问该数据。

由于我使用 $rootScope,我污染了全局命名空间,我想将数据从这个 Controller 传递到另一个 Controller 。

我只是在表中显示最少的数据,当用户单击表的特定记录时,我想在对象中显示全部数据。

这就是我的处理方式。

<tr ng-repeat="contact in filterContacts = (contacts.contactsData | filter:sensitiveSearch | orderBy:selectBox) " ng-style="{'background-color': contact.email == selectedContact.email ? 'lightgrey' : ''}" ng-click="selectContact(contact)">

在 Controller A 中:我从 View 中调用此函数并注入(inject)特定行的联系方式详细信息。

$scope.selectContact = function(contact) {
                contactService.selectedContactInfo(contact);
            };

在服务中我只是返回该数据 -

var selectedContactInfo = function(contact) {
            return contact;
        };

如何在同一事件期间访问 Controller B 中的此数据并将其显示在我的 View 上。

Here is the reference Link: http://plnkr.co/edit/beOmiv?p=info

我不想使用 $rootScope,但我想访问其他 Controller 上的数据。

最佳答案

您可以为此使用 Angular 服务。

Angular 服务是单例,您可以将它们注入(inject) Controller 中,这样您就可以在两个不同的 Controller 中注入(inject)相同的服务,并且可以有效地在它们之间传递状态。

假设您的服务中有一个名为 selectedUserID 的属性。单击特定行时可以更新此属性。然后在下一个 Controller 中,您注入(inject)相同的服务并使用此属性来确定您将加载哪些详细信息。

所以你可以在你的服务中有一个方法,如下所示:

updateSelectedUser = function(userID) {
    this.selectedUserID = userID;
}

当单击操作发生时,您的 Controller 会从服务中调用此方法:

myService.updateSelectedUser($scope.selectedUserID);

当然,这只是一个示例,请在其中添加您自己的值。

要记住一件事:服务可以保存状态,它们毕竟是对象和单例,因此您始终注入(inject)相同的实例。

确保存储在服务内的状态不会被不通过该服务的外部操作修改是有意义的。换句话说,请确保没有其他任何内容更改此 selectedUserID,以便您的服务状态数据永远不会不同步。如果你能做到这一点,那么你就是黄金。

关于javascript - 如何将数据从一个 Controller 传递到服务并在同一事件中访问其他 Controller 上的数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40613983/

相关文章:

javascript - jQuery:如何在没有ajax的情况下单击链接后发布数据?

javascript - jQuery fadeIn 'slow' 立即出现

angularjs - 没有模板的 Angular 组件表达式绑定(bind)

angularjs - 在angularjs中导入 Node 模块

perl - 向原型(prototype)添加可选参数

JavaScript Getters 和 Setters 问题

返回多个值的 JavaScript 数组迭代

javascript - 如何使用上一个和下一个按钮遍历 anchor 链接?

angularjs - 使用 Jasmine 和 PhantomJS 进行 Angular JS 测试,0 错误

javascript - 如何使用 Javascript/Jquery 删除总 div 内容