angular的scopel指令使用详解

　　我们来创建一个自定义指令

　　<!DOCTYPEhtml><htmllang="en"><head>

　　<metacharset="UTF-8">

　　<title>Document</title>

　　<style>

　　.primary{background:red;

　　}</style></head><bodyng-app="myApp">

　　<divng-controller="mainCtrl">

　　<my-btn></my-btn>

　　</div>

　　<scriptsrc="node_modules/angular/angular.min.js"></script>

　　varmyApp=angular.module('myApp',[]);

　　myApp.controller('mainCtrl',['$scope',function($scope){

　　$scope.myClass='primary';

　　}]);

　　myApp.directive('myBtn',function(){return{

　　template:'<inputtype="button"value="按钮"class="{{myClass}}">'

　　}

　　});</script></body></html>

　　1.png

　　使用自定义指令像上面一样的确不错，但是如果你想要对每一个指令渲染出来的按钮定制化，则好像不可以，比如下面我们创建一堆这个自定义指令，他们长得一模一样：