Angularjs 具有隔离作用域的指令意外访问父作用域
我已经创建了一个带有隔离作用域的指令Angularjs 具有隔离作用域的指令意外访问父作用域,angularjs,angularjs-directive,angularjs-scope,Angularjs,Angularjs Directive,Angularjs Scope,我已经创建了一个带有隔离作用域的指令my directive，但它似乎能够访问$rootScope的属性div1，以及controller1的父作用域$scope的属性div2 我错过了什么 Javascript: angular.module('app', []) .controller('controller1', ['$scope', function ($scope) { }]) .directive('m
my directive$rootScopediv1controller1$scopediv2angular.module('app', [])
.controller('controller1', ['$scope',
function ($scope) {
}])
.directive('myDirective', [
function () {
return{
restrict: 'A',
replace: true,
scope: {
myDirective:'='
}
};
}]);
<body>
<div id="1" ng-app="app" ng-init="div1='div1'">
<div id="2" ng-controller="controller1" ng-init="div2='div2'">
<div id="4" my-directive="value" ng-init="div4='div4'">
{{div4}}<br/>
{{div1}}<br/>
{{div2}}<br/>
</div>
</div>
</div>
</body>
div4
div1
div2
angular.module('app', [])
.controller('controller1', ['$scope',
function ($scope) {
}])
.directive('myDirective', [
function () {
return{
restrict: 'A',
replace: true,
scope: {
myDirective:'='
}
};
}]);
<body>
<div id="1" ng-app="app" ng-init="div1='div1'">
<div id="2" ng-controller="controller1" ng-init="div2='div2'">
<div id="4" my-directive="value" ng-init="div4='div4'">
{{div4}}<br/>
{{div1}}<br/>
{{div2}}<br/>
</div>
</div>
</div>
</body>
div4
div1
div2
该范围在指令的模板中被隔离。给你的指令一个模板或者写一个链接函数，你就会看到这个范围是隔离的。当您访问指令作用域的祖先时，这是在指令之外发生的，然后解析的html被“转移”到指令模板中，否则该模板是空的 这是一个有趣的问题。直到现在，我才意识到省略指令的模板实际上等同于在指令定义中包含
transclude:true，模板：“”.directive('myDirective', [
function () {
return{
restrict: 'A',
replace: true,
transclude: true,
template: '<div ng-transclude></div>',
scope: {
myDirective:'='
}
};
}]);
.directive（'myDirective'[
函数（）{
返回{
限制：“A”，
替换：正确，
是的，
模板：“”，
范围：{
myDirective:“=”
}
};
}]);
另请注意
myDirective:'='myDirective:'@'