AngularJS+RequireJS最小單元

最簡單配置,RequireJS結合AngularJS:javascript

index.htmlhtml

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8">
 5     <script type="text/javascript" src="require.js" data-main="main.js"></script>
 6 </head>
 7 <body>
 8     <div ng-controller="demoController">
 9         <label><input type="text" ng-model="results"/></label>
10         <br/>
11         <span ng-bind="results"></span>
12     </div>
13 </body>
14 </html>

main.jsjava

require.config({
    paths:{
        "angular":"angular"
    },
    shim:{
      "angular":{
          exports: "angular"
      }
    }
});

require(["angular","app"],function(angular,app){
    angular.bootstrap(document,['demoApp']);
});

app.jsbootstrap

define(["angular"], function(angular){
    var app=angular.module("demoApp",[])
        .controller("demoController", function($scope){
            $scope.results="To be defined...";
        });
});

展現結果:app

相關文章
相關標籤/搜索