zoukankan      html  css  js  c++  java
  • angularjs集成requirejs

    其实说成使用requirejs加载angularjs应用会更贴切一些

    <body>  
        <span ng-controller="homeController">{{resultValue.Msg}}</span>  
          
        <script src="js/lib/require.js" data-main="js/main"></script>  
    </body>  
    

    ###只不过需要手动启动angularjs,同时所有的模块由requirejs来组织并确定依赖关系,这样就能实现按需加载了 ```js /** * main.js * 这个文件完成的事情简单来说就是:载入所有文件,然后在document上运行Angular并将ng-app属性设置为’app’。 * 这些文件因为是由RequireJS异步载入,因此我们需要来“手动启动”Angular应用。 * * */

    require.config({
    paths: {
    //库文件
    //"responsive": "lib/responsive-nav",
    "angular": "lib/angular",
    "bootstrap": "lib/bootstrap.min",
    "angularRoute": "lib/angular-route",
    "angularResource": "lib/angular-resource",
    //"ui-bootstrap": "lib/ui-bootstrap-tpls-0.11.0.min",
    //"phprpc": "lib/phprpc_client",
    "jquery": "lib/jquery.min"
    },
    shim: {
    angular: {
    exports: "angular"
    },
    angularRoute: {
    deps: ["angular"]
    },
    angularResource: {
    deps: ['angular']
    }
    },
    urlArgs: "bust=" + (new Date()).getTime() //防止读取缓存,调试用
    });

    //手动启动ng
    define(["routes"], function () {
    //使用bootstrap方法启动Angular应用
    angular.bootstrap(document, ["app"]);
    });

    
    ```js
    /** 
     * routes.js 
     */  
      
    define([  
        "app"  
    ], function (app) {  
      
        //app是Angular应用对象  
        app.config(['$routeProvider',  
            function ($routeProvider) {  
      
                $routeProvider  
                    .when('/search', {  
                        templateUrl: 'template/search.html',  
                        controller: 'SearchCtrl'  
                    })  
                    .otherwise({ redirectTo: '/LmpSumQut' });  
      
            }]);  
      
    })  
    

    ###其他的模块代码略了,看参考链接: http://blog.csdn.net/yo548720570/article/details/41047309 http://www.open-open.com/lib/view/open1413189699875.html https://segmentfault.com/a/1190000000492238 http://www.cnblogs.com/kenkofox/p/4643760.html http://www.tuicool.com/articles/J3INv2Z http://blog.163.com/liuyong_xiaxia/blog/static/17435525520156341446981/
  • 相关阅读:
    chrome调试工具常用功能整理(转)
    js事件的相关收集
    键盘事件之keydown keypress keyup区别
    性能监控系统的搭建(转)
    关于浏览器并发请求数的研究及优化
    http头部信息研究
    什么是HTTP Keep-Alive呢?
    JavaScript跨域深入研究与解决办法(转)
    LRU Cache
    字节对齐&&sizeof
  • 原文地址:https://www.cnblogs.com/wancy86/p/ng-requirejs.html
Copyright © 2011-2022 走看看