菜鸟教程在线编辑器

AI 编程工具
 
                <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.net/angular.js/1.4.6/angular.min.js"></script> 
</head>
<body ng-app="myApp" ng-controller="YiMing">
姓名: <input type="text" ng-model="name"/> <br/>
	 <first></first>
	<second></second>
<script>
angular.module('myApp', []).directive('first', [ function(){
    return {
        restrict: 'AE', 
        template: 'first name:{{name}}'
    };
}]).directive('second', [ function(){
    return {
        scope: {}, // 创建指令自己的独立作用域，与父级毫无关系
        controller: function($scope) {
          $scope.name="YiMing"
        },
        restrict: 'AE', 
        template: 'second name:{{name}}'
    };
}]).controller('YiMing', ['$scope', function($scope){
    $scope.name="YiMing";
}]);
</script>
</body>
</html>
              