在下面的简单示例中，我通过 View 上的指令从 Controller 打印名称模型。该示例运行良好，但是的用途是什么？我无法理解的用途。有人可以解释其用法吗？
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js" ></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<people></people>
<script>
//module declaration
var app = angular.module("myApp",[]);
//controller declaration
app.controller('myCtrl',function($scope){
$scope.name = "Peter";
});
//directives declaration
app.directive('people',function(){
return{
restric: 'E',
template: '<div>{{name}}</div>',
transclude: true
}
});
</script>
</body>
</html>
最佳答案
您的代码并没有真正展示出超越的作用:
看一下这个特性，并更改true / false值:
Plunk
您希望现在会注意到效果。来源来自plunkr，进行了一些修改。
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@1.5.3" data-semver="1.5.3" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<people>HI there</people>
<script>
//module declaration
var app = angular.module("myApp",[]);
//controller declaration
app.controller('myCtrl',function($scope){
$scope.name = "Peter";
});
//directives declaration
app.directive('people',function(){
return{
restric: 'E',
template: '<div><ng-transclude></ng-transclude>: {{name}}</div>',
transclude: false
}
});
</script>
</body>
</html>
因此，当它为真时，您将看到内容被隐藏，
因此它说HI There:Peter
当为False时，它将删除HI There，但保留名称和我的冒号:
:彼得