为什么这个指令不起作用，..can有人解释？
为什么这个指令不起作用，..can有人解释？
提问于 2014-10-27 05:12:40
这是我的html页面：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="angular.min.js"></script>
<script src="scoping_directives.js"></script>
</head>
<body ng-app="scoping">
<div ng-controller="OuterController">
<p>{{outer_var}}</p>
<my-directive></my-directive>
</div>
</body>
</html>这是JS文件：
angular.module('scoping', [])
.controller('OuterController', function($scope){
$scope.outer_var = 10;
})
.directive('myDirective', function() {
console.log("inside directive1");
return {
/*scope :{
inner_var : 20
},*/
template:'<p>tanmay</p>'
};
});请有人解释为什么没有呈现指令中的模板。我只得到10作为输出。不存在由输出产生的错误。
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-10-27 05:18:49
在指令中通常需要限制选项，应该将其设置为：
'A' -只匹配属性名
'E' -只匹配元素名称
'C' -只匹配类名
所有这些限制都可以视需要合并：
'AEC' -匹配属性、元素或类名
详细说明如下所示
工作演示
angular.module('scoping', [])
.controller('OuterController', function ($scope) {
$scope.outer_var = 10;
})
.directive('myDirective', function () {
console.log("inside directive1");
return {
restrict: 'E',
template: '<p>tanmay</p>',
replace: true
/*scope :{
inner_var : 20
},*/
};
});使用指令的定义对象的限制属性，我们可以决定指令可以出现在DOM中的位置。我们有四种选择：
1.元素
restrict: 'E'该指令只能显示为HTML元素。
示例：
<my-directive></my-directive>2.属性
restrict: 'A'该指令只能在元素中显示为HTML属性。如果未指定限制，则此值为默认值。
示例：
<div my-directive="expression"></div>3. 类
restrict: 'C'该指令只能出现在HTML元素的类属性中。
示例：
<div class="my-directive: expression;"></div>4.评论
restrict: 'M'该指令只能出现在HTML注释中。
示例：
<!-- directive: my-directive expression -->安古拉舒布-限制提供
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26581516
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号