2

我是 angularjs 的新手,一直在尝试使用 angularui 模块来构建手风琴。对于每个手风琴标题,我都有一个嵌套标签,可以调用我的服务工厂。服务工厂根据 id 返回数据并更新我的内部手风琴内容,但是它会为所有手风琴标题更新它。因此,换句话说,单击手风琴标题将为所有手风琴 div 加载相同的内容。我希望它只返回到单击的标题。我相信我需要更多帮助来了解我的工厂服务范围。所以我的问题是是否有人可以帮助我了解如何让我的服务工厂只更新它的调用者。

我的html:

<accordion close-others="false">
<accordion-group ng-repeat="dept in departments"> 
  <accordion-heading>
    <span ng-controller="DeptHeaderCtrl" ng-click="loadEmps(dept.DeptID)">
      {{dept.DepartmentName}} ({{dept.DepartmentShortName}})
    </span>
  </accordion-heading> 
  <div ng-controller="departmentList">
    <div ng-repeat="emp in deptemps">
      {{emp.Name_First}}
    </div>
  </div>
</accordion-group>

angularjs工厂服务代码:

app.factory('DeptFactory', function ($http, $rootScope) {
      var sharedDeptEmpList = {};

      sharedDeptEmpList.EmpList = '';

      sharedDeptEmpList.fetchDeptEmps = function (deptid) {
        var dept = { "userid": userid, "deptid": deptid };

        $http({ method: 'POST', url: 'api/Fetch/DeptEmployees/', data: dept }).
      success(function (data, status, headers, config) {
        EmpList = data;
        sharedDeptEmpList.broadCastEmpList();
      }).
      error(function (data, status, headers, config) {
        alert('error');
      });

      };

      sharedDeptEmpList.broadCastEmpList = function () {
        alert('broadcasting');
        $rootScope.$broadcast('handleBroadcast');
      };


      return sharedDeptEmpList;

    });

接收广播的 Angularjs 控制器:

app.controller('departmentList', function ($scope, $http, DeptFactory) {

      $scope.init = function (p_userid) {
        userid = p_userid;
      };


      $scope.$on('handleBroadcast', function () {
        alert('broadcast received');
        $scope.deptemps = EmpList;
      }); 

  });
4

1 回答 1

3

每个指令只是一些将 DOM 节点与给定范围相关联的 javascript。与您想到 DOM 树的方式相同,您可以想到“范围树”。另一方面,服务只是可以在任何地方注入和使用的单例对象。它们与 DOM/范围树没有隐含关系。

通过将 $rootScope 注入您的 DeptFactory,您将授予它访问整个作用域树的权限。当您调用 $broadcast() 时,您将在整个树中发送一个事件,从根开始,然后向外传播到所有叶范围。

我没有看到足够多的代码来完全理解正在发生的事情,但我猜你看到你所有的手风琴 div 都发生了变化,因为它们都在接收你的 $broadcasted 事件,并以同样的方式对其做出反应。我建议您 $broadcast 某种 ID 值来识别您要更改的 div。然后,当您在每个手风琴中处理此事件时,对照手风琴的 ID 检查 ID 以查看它是否应该更改。

这有帮助吗?

于 2013-10-21T22:23:18.073 回答