angular js 实例参数学习 

<!DOCTYPE html>
<html>
<head>
<meta name="description" content="[add your bin description]">
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script src="http://apps.bdimg.com/libs/angular.js/1.4.0-beta.4/angular.min.js"></script>
  <script>

  //directive文件directives.js中定义一个myTest  

//定义一个模块 angular.module('myApp',[]), 获取一个模块 angular.module('myApp')
var phonecatDirectives = angular.module('phonecatDirectives', []);    

//定义一个指令
phonecatDirectives.directive('myTest', function() {  
    return {  
        restrict: 'ACEM',  
        require: '^ngModel',  
        scope: {  
            ngModel: '='  //变量 数据绑定
        },  
        template: '<div><h4>Weather for {{ngModel}}</h4></div>'  
    }  
});  
  
//controller文件controller.js中定义directive1 定义控制器 

var dtControllers = angular.module('dtControllers', []);  
  
dtControllers.controller('directive1',['$scope',  
    function($scope) {  
        $scope.name = 'this is tank test';  
    }  
]);  
  
//在app文件app.js中整合controller,directive  模块
  
var phonecatApp = angular.module('phonecatApp', [  
    'phonecatDirectives',  
    'dtControllers'  
]);
    
  </script>
</head>
<body ng-app="phonecatApp">  
    <div ng-controller="directive1">  
        <input type="text" ng-model="city" placeholder="Enter a city" />  
  
        <my-test ng-model="city" ></my-test>  
        <span my-test="exp" ng-model="city"></span>  
        <!-- directive: my-test exp -->  
        <span ng-model="city"></span>  
    </div>  
</body> 
</html>

 

posted @ 2015-06-16 16:16  北斗极星  阅读(262)  评论(0)  编辑  收藏  举报