给出错误结果的指令范围为真

Question

我在指令中使用范围作为 'true'。所以现在，这个指令范围从父级传递到子级，但不是反向传递。我现在正在打印 scope.name 2 次。首先在父范围内，其次在指令中。现在我应该得到 2 个不同的值。但是，我为两者获得了相同的范围值。请帮忙解释一下！

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

//controller declaration
app.controller('myCtrl',function($scope){
$scope.name = "Peter";
});

//app declaration
app.directive('myStudent',function(){

return{
 template: "{{name}}",
 scope:true
}
controller: [function(){
 $scope.name = "Roger"
}]

});

<body ng-app="myApp" ng-controller="myCtrl"> 

{{name}}, 

<my-student></my-student> 

</body> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>

Answer 1

在 DDO 中编写控制器。

//app declaration
app.directive('myStudent',function(){

return{
    template: "{{name}}",
    scope:true,
    controller: ['$scope', function($scope){
        $scope.name = "Roger"
    }]
}

这可能会解决您的问题。

Answer 2

你的控制器没有指令。我把它放在里面并添加了 $scope 依赖。有效！

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

//controller declaration
app.controller('myCtrl',function($scope){
$scope.name = "Peter";
});

//app declaration
app.directive('myStudent',function(){

return{
 template: "{{name}}",
 scope:true,
        controller: ['$scope', function($scope) {
            $scope.name = "Roger"
        }]
}


});

<body ng-app="myApp" ng-controller="myCtrl"> 

{{name}}, 

<my-student></my-student> 

</body> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>

Answer 3

轻松在父控制器中创建一个对象，以便它可以与指令绑定即 var x={}; x.value=value;// 你想传递然后尝试访问它。

给出错误结果的指令范围为真

Scope true in directive giving wrong result

javascript

angularjs

angularjs-scope

angular2-directives