0

我正在开发一个应用程序，该应用程序在controllerA页面上使用多个（但相似）控制器（）和另一个controllerB可以更改某些属性的控制器（），但前提controllerA是先前选择了元素。

（在controllerA某些属性中可能有默认值，通过使用 data- 属性传递和应用）

在这个阶段，我只能修改最后一个颜色属性controllerB(这是有道理的，因为那是活动范围。我的问题是，如何将 controllerB 范围更改为 selected 的“活动”范围副本controllerA？

// Code goes here

var webApp = angular.module("webApp", []);

webApp.controller("controllerA", function($scope, $rootScope, $element, styleFactory){
$scope.selected = false;
var color = angular.element($element[0]).attr("data-style-color");
styleFactory.setColor(color);  
$scope.data = styleFactory.getData();

$scope.select = function(){
  $scope.selected = !$scope.selected;
}
});

webApp.controller("controllerB", function($scope, $rootScope, $element, styleFactory){
  $scope.data = styleFactory.getData();
});

webApp.factory("styleFactory", function(){
  var data = {"style":"color:yellow"}

  return {
    setColor: function(color){
      data = {"style":"color:"+color};
    },
    getData: function(){
      return data;
    }
  };
});

完整示例： http ://plnkr.co/edit/He2m7ArfRSur9Igq2eur?p=preview

谢谢，--iM

4

1 回答 1

0

您可以看到修改后的 plnkr，如您在此处描述的那样工作。

就个人而言，我会重新构建应用程序的架构并重新考虑 styleFactory 的实现。

一些思考点：

  • data = {"style":"color:"+color}替换整个数据对象，因此$scope.data = styleFactory.getData()仅适用于最后一个controllerA，因为所有其他对象的引用都丢失了。

  • controllerA尝试创建一个位于and之上的父控制器controllerB。

  • 尝试使用指令解决这个问题。

于 2013-08-03T03:30:01.530 回答