Javascript 范围值仅从一个控制器接收更新

我有一个按钮box.component.js：

单击它会创建一个填充数组的对象，my list.component.js：（在视图中显示为圆圈）：

并通过parms-bar.component显示其名称和参数：

这些组件之间的通信由两个服务管理。检测所选对象main.service.js的一个：

其中一个返回列表中的项目（圆圈），ui.service.js：

当我点击一个圆时，我想切换到相应的对象，所以显示它的参数，但这不起作用。似乎参数视图只被框控制器更新。可能是我的

list.component.js

中出现了问题，我试图将圆圈设置为选中状态

 this.selected = function (value) {

            var nodes = UiService.getNodesHolder();

            UiService.selected = nodes.children[value];

        }

---

实际上，当您在box.component.js文件中将其更改为objet模型时

box = {
  "name": "Box",
  "id": nodesHolder.length,
  "parameters": {
    "parm1":  Math.floor((Math.random() * 10) + 1), 
    "parm2":  Math.floor((Math.random() * 10) + 1), 
    "parm3":  Math.floor((Math.random() * 10) + 1)
  }
}

---

然后选择显示正确值的圆圈。请使用

console.log（UiService.selected）进行检查在列表.component.js文件中

并且list.template.html文件中的一些小错误更改为
。实际上，在plnkr中是这样的
。很抱歉，我可以继续这么多，只是我需要一些时间来让它工作。
实际上，当你在box.component.js文件中将其更改为objet模型时

box = {
  "name": "Box",
  "id": nodesHolder.length,
  "parameters": {
    "parm1":  Math.floor((Math.random() * 10) + 1), 
    "parm2":  Math.floor((Math.random() * 10) + 1), 
    "parm3":  Math.floor((Math.random() * 10) + 1)
  }
}

然后选择显示正确值的圆圈。请使用
console.log（UiService.selected）进行检查在列表.component.js文件中

并且list.template.html文件中的一些小错误更改为
。实际上，在plnkr中是这样的
。很抱歉，我可以继续这么多，只是我需要一些时间来让它工作。
这里的重点是保持对象不变，我在这里发现了两件事

首先，由于要保持对象不变，因此当addbox函数运行时，会对同一对象进行操作，即数组中的所有值
获取最新修改的值。所以，为了对抗它，我创建了一个box对象的新副本，同时将它推到数组中

nodesHolder.push(angular.copy(box));

其次，在list component.js中，您没有更新mainService.selected，所以我更改了

UiService.selected = nodes.children[value];
              to
mainService.selected = nodes.children[value];

现在，由于第一种解决方案，出现了另一个问题。因为，我正在制作对象的副本，所以在mainService.selected中设置的值与其中的以前的值不同。为了保持对象不变，我创建了两个函数

1. function clearObject(obj){
         // Function that cleans up the keys of the given object 
         // without creating a new object.
   }

2. function copyData(obj) {
       // Function that copies the new object data to selected.
   }

最后，这是正在工作的plunk，
这里的重点是保持对象不变，我在这里发现了两件事

首先，由于要保持对象不变，因此当addbox函数运行时，会对同一对象进行操作，即数组中的所有值
获取最新修改的值。所以，为了对抗它，我创建了一个box对象的新副本，同时将它推到数组中

nodesHolder.push(angular.copy(box));

其次，在list component.js中，您没有更新mainService.selected，所以我更改了

UiService.selected = nodes.children[value];
              to
mainService.selected = nodes.children[value];

现在，由于第一种解决方案，出现了另一个问题。因为，我正在制作对象的副本，所以在mainService.selected中设置的值与其中的以前的值不同。为了保持对象不变，我创建了两个函数

1. function clearObject(obj){
         // Function that cleans up the keys of the given object 
         // without creating a new object.
   }

2. function copyData(obj) {
       // Function that copies the new object data to selected.
   }

最后，这是正在工作的plunk，
与示例混为一谈（在所选对象中添加了一个
console.log（value）
），无论单击哪个圆圈，
id
都是same@Vasseurth-没错。实际上，在我的原始项目中，它返回了正确的id，只是没有更新视图。为了举例说明问题，我把事情搞砸了。我将尝试通过示例来解决这个问题（添加了一个
console.log（value）
to selected），无论单击哪个圆圈，
id
都是same@Vasseurth-没错。实际上，在我的原始项目中，它返回了正确的id，只是没有更新视图。为了举例说明问题，我把事情搞砸了。我将尝试修复它感谢您的帮助，但现在参数根本没有显示：（感谢您的帮助，但现在参数根本没有显示：(
1. function clearObject(obj){
         // Function that cleans up the keys of the given object 
         // without creating a new object.
   }

2. function copyData(obj) {
       // Function that copies the new object data to selected.
   }