–*指令 end
<!DOCTYPE html><html><head><meta charset="utf-8"><meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" /><script src="angular.min.js"></script><style> .custom-html{color:red;}</style></head><body><div ng-app="myApp" ng-controller="myCtrl" ng-init="cost=5;num=4;address={PRovince:'shenzhen',detail:'nanshan'};age=[25,26,27]"> 姓：<input type="text" ng-model="firstName"><br> 名：<input type="text" ng-model="lastName"><br> 全名：{{firstName + ' ' + lastName}}<br> <ul ng-repeat="value in age"> {{value}}岁? </ul> 年龄：{{age[2]}} <br> 4*5 = {{cost * num}} <br> 居住地：{{address.province+' '+address.detail}} <br> <ul ng-repeat="value in country"> {{value.name}} : {{value.num}}枚金牌 </ul> <custom-html></custom-html> <!-- E --> <div custom-html></div> <!-- A --> <div class="custom-html"></div> <!-- C --> <!-- M replace:true --> <!-- directive: custom-html --></div><script> var app = angular.module('myApp',[]); //demo中ng-app为‘myApp’元素是angular应用程序 app.controller('myCtrl',function($scope){ //myApp应用程序是由什么数据内容控制的 $scope.firstName = "SUN"; $scope.lastName = "GANG"; $scope.country = [ {num:25,name:'中国'}, {num:3,name:'USA'}, {num:0,name:'JP'}, ] }); app.directive("customHtml",function(){ return { restrict : "AECM", replace : true, template:"<h3>directive用于自定义标签内容！</h3>" } })</script></body></html>新闻热点
疑难解答
