javascript - Angular 如何使用不同 Controller 的范围

标签 javascript angularjs controller angularjs-scope

我有一个 user.list.ctrl 和一个 user.detail.cntr。所有 Controller 都构建为模块,并注入(inject)到我在 app.js 中注入(inject)的“用户模块”中。 (请参阅下面的 plunker 中的完整代码)

我的 Controller 模块

angular.module('user-module', ['user-module.controllers']);

我的用户模块

angular.module('demo.app', ['user-module']);

在两个 Controller 中,我都使用来自 REST 工厂的数据注入(inject) user-Fctr。 (效果很好)

user.list.cntrl 有一个 $scope.refresh() user.detail.cntrl 有一个 $scope.update()

用户.list.cntrl

    1. 当我输入新记录时,我调用 $scope.refresh() 以便刷新列表。 (这工作正常)

用户.detail.cntrl

    1. 当我从列表中单击用户时,用户详细信息会加载到不同的 View 中(工作正常)
  • 当我更新 user.detail 时,我想调用 $scope.refresh() 来更新 user.list ,但它不起作用。我无法调用 $scope.refresh()

我认为,既然我将同一个工厂注入(inject)到两个 Controller 中,我就可以使用彼此的 $scopes。

关于如何使用 $scope.refresh() (或在更新 user.detail.js 时更新列表)的任何想法

我用所有js文件制作了一个plunker(该plunker不起作用,它只是为了显示我拥有的代码) http://plnkr.co/edit/HtnZiMag0VYCo27F5xqb?p=preview

感谢您查看此内容

最佳答案

这是一个非常概念化的问题。

您已经为每个 View “部分”创建了一个 Controller ,因为它们适用于不同的事件。这就是 Controller 的目的。所以说是对的。

但是,您正在尝试访问在一个 Controller 中编写的刷新功能,在另一个 Controller 中。从字面上看,这是错误的,从那时起,刷新在用户列表 Controller 或详细信息 Controller 中都不合适。

Controller 是一种用于控制(字面上)特定 View 上发生的情况的函数。 - 您可以使用一个用于列表的 Controller 和一个用于详细信息的 Controller 。

要在 Controller 之间共享的功能必须是一项服务。这正是您希望的刷新功能。

每当你将同一个工厂注入(inject) n 个 Controller 时,你不能使用每个 Controller 的作用域。这不是 Controller 的目的。

但是,每当您将同一个工厂注入(inject) n 个 Controller 时,您都可以使用其公开的方法。

您遇到的问题,可以通过以下方式解决:

app.factory( 'sharedFunctions', [ 'factoryId', function sharedFunctions( factoryId ) { 
  var refresh = function () {
   factoryId.getAll(/*your params to query*/)
     .success( function ( response ) {
        //This will return the list of all your records
        return response;
     }); 
  };
  return sharedFunctions;
}]);

注册此工厂服务后,您可以将其注入(inject)到 Controller 中,并且每当您需要刷新时,只需调用该服务的公开方法并将新信息绘制到 View 中即可。

希望它对您有用!

关于javascript - Angular 如何使用不同 Controller 的范围,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26639220/

相关文章:

javascript - GWT HashMap.put() 没有向 HashMap 添加数据

javascript - Greasemonkey Javascript 按键

javascript - AngularJS 的全局 Ajax 错误处理程序

javascript - 为什么 JQuery $.post 提交两次?

c++ - C++ 中的 Controller /迷你内核设计模式

authentication - 从 Grails 中的过滤器定义 Controller 可访问变量

javascript - 一次性删除范围记录 - mongodb

javascript - 搜索文本框的 XSS 脚本

angularjs - angular-ui 全局键绑定(bind)

javascript - Angular 在 IE8 上,选择元素中的显示数据无法正常工作