- Gemeinschaft
- Lernen
- Tools-Bibliothek
- Freizeit
Heim > Fragen und Antworten > Hauptteil
今天学习指令，遇到了一些困惑：
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="../css/lib/bootstrap4.css">
<script type="text/javascript" src='../js/lib/angular.js' ></script>
<script type="text/javascript" src='js/scope2.js'></script>
</head>
<body>
<p ng-init = 'someProperty="some date"'>
<p ng-init='siblingProperty="moredata"'>
Inside p Two : {{aThirdProperty}}
<p ng-init="aThirdProperty='data for 3rd property'" ng-controller="someCtrl">
Inside p Three: {{aThirdProperty}}
<p ng-controller="secondCtrl">
Inside p Four: {{aThirdProperty}}
<br>
OutSide myDirective: {{myProperty}}
<p my-directive ng-init="myProperty='wow! that is cool'">
Inside myDirective : {{myProperty}}
</p>
</p>
</p>
</p>
</p>
</body>
</html>js
var app = angular.module('app', []);
app.controller('someCtrl', ['$scope', function($scope){
}])
app.controller('secondCtrl', ['$scope', function($scope){
console.log($scope.myProperty) //undefined
}])
app.directive('myDirective',function(){
return {
restrict :'A',
scope:false
}
})为什么打印出来的是undefined？
然后把js指令里的scope改为scope:{};为什么弹出来的是这个？就是说为什么外面的OutSide myDirective: wow! that is cool会有值？
Inside p Two :
Inside p Three: data for 3rd property
Inside p Four: data for 3rd property
OutSide myDirective: wow! that is cool
Inside myDirective : wow! that is cool
过去多啦不再A梦2017-05-15 17:00:35
<p my-directive ng-init="myProperty='wow! that is cool'">
Inside myDirective : {{myProperty}}
</p>首先，你写的这个跟指令没多大关系。指令的scope是影响它的template的作用域，这里并不是。
app.controller('secondCtrl', ['$scope', function($scope){
console.log($scope.myProperty) //undefined
}])这里undefined的原因是因为controller在ng-init之前执行了。可以用用延时或者$watch监听
$timeout(function() {
console.log($scope.myProperty)
});
// or
$scope.$watch('myProperty', function(newVal) {
console.log($scope.myProperty)
})
阿神2017-05-15 17:00:35
嗯，，，上面那个undefined我懂了，，不过后面那个我还是有点疑惑，，就是说当scope:{}时，Inside myDirective : {{myProperty}}这个表达式还是属于外面那个作用域是不是？而此时template里面并没有设定，，，所以隔离作用域就没有起作用，我这样理解对吗？
还有一个问题，既然这样，，，那为什么如果把scope设定为scope:true是下面这样的结果：
Inside p Two :
Inside p Three: data for 3rd property
Inside p Four: data for 3rd property
OutSide myDirective:
Inside myDirect33ive : wow! that is cool能否再指点一下，，，谢谢~~
