angularjs 简单指令 

<!DOCTYPE html>
<html data-ng-app="app">
    <head>
        <title>angular js</title>
        <meta charset="utf-8">
        <script src="angular.min.js"></script>
        <script type="text/javascript">
            var app = angular.module("app",[],function(){
                console.log("init");
            });
            app.directive("myDiv",function(){
                return {
                    restrict: "E",
                    scope: {
                        myTitle: "=myTitle"
                    },
                    template: "<input type='text' data-ng-model='myTitle' /><h1>{{myTitle}}</h1>"
                    //,replace: true 如果设置为true,template的内容要有个根容器<div><input type='text' data-ng-model='myTitle' /><h1>{{myTitle}}</h1></div>
                }
            });
            var controller = app.controller("myController",function($scope){
                $scope.ctrlTitle = "";
            });
        </script>
        
    </head>

    <body data-ng-controller="myController">
        <input type="text" data-ng-model="ctrlTitle" /><br/>
        <my-div my-title="ctrlTitle"></my-div>

        <script type="angular/template" id="template1">
            <h1>模板内容</h1>
        </script>
        
    </body>
</html>

 

posted @ 2015-12-22 21:15  不要相信我  阅读(324)  评论(0)    收藏  举报