Javascript 为什么指令之间的角度绑定在转移时会中断？

我有下面的场景

我将一个带有控制器的页面和几个指令组合在一起，其中一个指令打开了transclude开关（这似乎是导致问题的原因）

当我点击“changeMe（）”时，作用域的值变为

erez

当我单击“close”时，我们将

null

分配给指令范围内的属性。我用null以外的值验证了相同的场景

当我再次单击“changeMe（）”时。。。什么都没发生！！为什么呢？我怎么修理它

HTML模板

<div my-layout="">
  <button ng-click="changeName()">Change me!</button>
  <div>
     {{name}} - This is my name directive
     <div my-name name="name"></div>
  </div>
</div>

改变我！
{{name}}-这是我的name指令

Javascript代码

angular.module('guy', []);

angular.module('guy').controller('GuyCtrl', function($scope){
  $scope.name = 'guy';

  $scope.changeName = function(){
    $scope.name = 'erez';
  }
});


angular.module('guy').directive('myName',function ($log) {
        return {
            template: '<div> my name is: {{name}} <button ng-click="close()">Close</button></div>',
            restrict: 'EA',
            scope: {
                name : '=name'
            },
            link: function postLink($scope, element) {
              $scope.close = function(){
                $scope.name = null;
              }
            }
        }
    }
);


angular.module('guy').directive('myLayout',function ($log) {
        return {
            template: '<div>This is the grand layout<div ng-transclude></div></div>',
            restrict: 'EA',
            transclude:true, 


            link: function postLink($scope, element) {
                 $log.info('linking layout');
            }
        }
    }
);

angular.module（'guy'，[]）；
角度.module（'guy'）.controller（'GuyCtrl'，function（$scope）{
$scope.name='guy'；
$scope.changeName=函数（）{
$scope.name='errez'；
}
});
angular.module（'guy'）。指令（'myName'，函数（$log）{
返回{
模板：'我的名字是：{{name}}Close'，
限制：“EA”，
范围：{
名称：'=名称'
},
链接：函数postLink（$scope，element）{
$scope.close=函数（）{
$scope.name=null；
}
}
}
}
);
angular.module（'guy'）。指令（'myLayout'，函数（$log）{
返回{
模板：“这是大布局”，
限制：“EA”，
是的，
链接：函数postLink（$scope，element）{
$log.info（‘链接布局’）；
}
}
}
);

---

您可以使用

您是典型作用域继承的受害者。简而言之：切勿将第一级（即

$scope.xxx

）属性用于双向绑定。相反，使用包装器对象（

data

或

model

是方便的名称）作为：

$scope.data={name:'guy'}

发生的情况是，通过原型作用域继承，

myLayout

指令在控制器的作用域下创建一个新的作用域。因此，每当它从不存在的第一级属性（即

$scope.name

）读取时，它都从父级读取。当它写的时候，它会写给自己。并且进一步读取访问本身。对第一级继承属性的更改永远不会传播到原型父级

用这个原理检验一个叉子；并确保您了解Javascript的原型继承，它应用于Angular的作用域