AngularJS：如何在使用ng repeat时将一个指令中的变量更改反映到另一个指令中

在第一种情况下：我执行了一个指令

directive2

，该指令将更改

bar

值，该值也将反映在

directive1

中
在这里您可以找到（第一种情况）

在第二种情况下：我执行了一个指令

directive2

，与该指令一起使用

ng repeat

，该指令改变

条

值，这应该反映在

directive1

中
在这里，您可以找到带有

ng repeat

（第二种情况）

我希望它如何工作：我希望

方向1中的
条形图
根据
方向2的变化而变化

我的问题：第一个案例正按照我想要的方式运作。在第二种情况下，
directive1
中的
bar
值不会随着
directive2
中的更改而更改
我的假设是，使用
ng repeat
会创建多个作用域，因此不会以我想要的方式工作

我如何解决这个问题

HTML片段（第二种情况）


这是方向1：


这是ng repeat{{item}的方向2

JS片段（第二种情况）

var-app=angular.module（'myApp'，[]）；
app.directive（'directive1'，function（）{
返回{
限制：'E'，
替换：正确，
模板：“{bar}}”
}
});
app.directive（'directive2'，function（）{
返回{
限制：'E'，
范围：{
酒吧：“=”
},
替换：正确，
链接：功能（s、e、a）{
s、 bar=“更改的值”；
},
模板：“{bar}}”
}
});
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.name='World'；
$scope.bar=“原始值”；
});
你猜对了！这是因为
ng repeat
创建了子作用域

当您使用
bar
依赖项创建隔离作用域时，
bar
上的设置操作将在父作用域上设置条形值。在ng repeat的情况下，父作用域是
ng repeat
作用域，因此这种行为

使用对象而不是字符串来传递字符串引用，它将起作用。检查我的枪

将bar变量设置为

$scope.data={};
$scope.data.bar ="original value";

用户指令类


var app = angular.module('myApp', []);

app.directive('directive1', function() {
    return {
        restrict: 'E',

        replace: true,
        template: '<div><span>{{bar}}</span></div>'
    }

 });

app.directive('directive2', function() {
  return {
      restrict: 'E',
      scope:{
        bar:"="
      },
       replace: true,
       link:function(s,e,a){
         s.bar = "Changed value";
       },
       template: '<div><b>{{bar}}</b></div>'
  }

});

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.bar ="original value";
});

$scope.data={};
$scope.data.bar ="original value";