Javascript AngularJS-范围差异

我创建了一个简单的提琴，以说明

范围（true、false、{}）

之间的差异

但我不明白，为什么它没有像我期望的那样工作

1） 为什么更改控制器上的“

val

”会影响带有“

scope:true

”的

directiveTwo

”。若我更改指令中的值，那个么控制器将停止对其进行影响

2） 为什么

directiveThree

具有隔离作用域，但它继承了控制器的值（因此在

directiveOne

中创建的值传递给它），更改控制器中的值会影响

directiveThree

。当我更改该指令的值时，它会影响控制器的值。隔离范围不应该被隔离吗

HTML:

---

DirectiveTwo可能会接受控制器的更改，但当DirectiveTwo更改值（…）时，控制器不会更改，这是因为当希望子级更改父级的值时，裸值将不起作用

什么是裸值

angular.module("myApp", [])
.controller("ctrl1", function($scope){
    $scope.val ={
        value = "CTRL"   <--- This way a child will inherit the OBJECT and NOT a COPY
    };
    $scope.val = "CTRL"; <--- This way the child inherits a COPY of the BARE-VALUE
})

angular.module（“myApp”，[]）
.控制器（“ctrl1”，功能（$scope）{
$scope.val={
value=“CTRL”也许Angular默认为指令的
transclude:true
？然后指令中会出现
val
，并绑定到最外层控制器的模型，解释您看到的行为。Thx，我修复了小提琴…我没有看到指令被转置。是的，我找到了小提琴的修复程序，并且已经完成如果你将指令div的内容移动到指令的模板中，并使用
scope:{}
您将获得预期的行为。因此Angular可能会将div的内容放入外部控制器范围，因为它不会将其视为指令的一部分，而不是将其定义为指令的模板。看起来Batarang不会与JSFIDLE一起工作，但尝试在该脚本本地使用它；它会显示您使用的范围ve和放置在哪里的内容。然后，仔细研究代码，看看对作用域做了哪些更改。这可能是解决这一问题的最佳方法。是的，使用模板这是可行的。我不知道模板在这种情况下的重要性。但我仍然不明白，为什么使用directiveTwo（使用作用域：true），更改控制器上的值会影响指令。只有在修改指令中的值后，控制器才会更改“停止”以影响指令值。
angular.module("myApp", [])
.controller("ctrl1", function($scope){
    $scope.val = "CTRL";
})
.directive("directiveOne", function(){
    return {
        controller: function($scope){
            $scope.childVal = 1;
        },
        scope:false //or not defined at all
    };
})
.directive("directiveTwo", function(){
    return {
        controller: function($scope){
            $scope.childVal = 2;
        },
        scope:true
    };
})
.directive("directiveThree", function(){
    return {
        controller: function($scope){
            $scope.childVal = 3;
        },
        scope:{}
    };
});

angular.bootstrap(document.getElementById('myApp'), ["myApp"]);

angular.module("myApp", [])
.controller("ctrl1", function($scope){
    $scope.val ={
        value = "CTRL"   <--- This way a child will inherit the OBJECT and NOT a COPY
    };
    $scope.val = "CTRL"; <--- This way the child inherits a COPY of the BARE-VALUE
})