使用requirejs来管理angularJS依赖示例
有关requirejs是什么在这里不做解释,只用纯代码实战让你感受requirejs依赖管理的强大。
一、首先要先下载require.js,然后整一个入口文件main.js包括了对其他js的引用。
- //配置依赖
- require.config({
- paths: {
- "angular":"angular"
- },
- shim:{
- "angular": {
- "deps":[],
- "exports": "angular"
- }
- }
- });
- //定义模块
- define([
- 'angular',
- 'controller'
- ], function (angular) {
- angular.module('HelloModel', ['HelloCtrls']);
- return {
- angularModules: [ 'HelloModel' ]
- };
- });
二、定义angular中的控制器模块controller.js
- define([ 'angular' ], function(angular) {
- var componentCtrls = angular.module('HelloCtrls', []);
- componentCtrls.controller('helloCtrl', [ '$scope', function($scope) {
- $scope.greet = "hello world";
- } ]);
- return componentCtrls;
- });
三、新建一个index.html文件测试
- <!DOCTYPE html>
- <html ng-app="HelloModel">
- <head>
- <meta charset="UTF-8">
- <title>Insert title here</title>
- <script src="js/require.js" data-main="js/main" defer async="true" ></script>
- </head>
- <body ng-controller="helloCtrl">
- {{greet}}
- </body>
- </html>
四、文件组织结构
使用requirejs来管理angularJS依赖示例的更多相关文章
- AngularJS开发指南15:AngularJS的创建服务,将服务注入到控制器,管理服务依赖详解
创建服务 虽然AngularJS提供了很多有用的服务,但是如果你要创建一个很棒的应用,你可能还是要写自己的服务.你可以通过在模块中注册一个服务工厂函数,或者通过Module#factory api或者 ...
- 47.使用 RequireJS 加载 AngularJS
转自:https://www.cnblogs.com/best/tag/Angular/ AngularJS 目前的版本没有遵循 Javascript 约定的 AMD 模块化规范, 因此使用 Requ ...
- flutter如何使用配置文件pubspec.yaml(位于项目根目录)来管理第三方依赖包
官方文档 在软件开发中,很多时候有一些公共的库或SDK可能会被很多项目用到,因此,将这些代码单独抽到一个独立模块,然后哪个项目需要使用时再直接集成这个模块,便可大大提高开发效率.很多编程语言或开发工具 ...
- AngularJS依赖注入
<html> <head> <meta charset="utf-8"> <title>AngularJS 依赖注入</tit ...
- AngularJS 依赖注入
依赖注入(Dependency Injection,简称DI)是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入(或者通过引用传递)到一个独立的对象(或客户端)中,然后成为了该 ...
- 4.Maven概念模型,maven的生命周期,Maven坐标,依赖管理(依赖范围,依赖声明),仓库管理,私服概念
1 maven概念模型 2 maven的生命周期,项目构建过程 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdG90b3R1enVvcXVhbg== ...
- 关于angularjs依赖注入的整理
初学angularjs阶段,刚刚看到菜鸟教程的angularjs依赖注入.现在整理一下: 1.含义:一个或更多的依赖(可以理解为模块关系依赖)或服务(分为内建服务[例如$http,$tiomeout等 ...
- Android使用gradle依赖管理、依赖冲突终极解决方案(转)
Android使用gradle依赖管理.依赖冲突终极解决方案在Android开发中,相信遇到关于版本依赖的问题的同学有不少.虽然Android Studio一般都会自动帮我们去重,但是有时候去重失败了 ...
- (五)Angularjs - 依赖注入
如何找到API? AngularJS提供了一些功能的封装,但是当你试图通过全局对象angular去 访问这些功能时,却发现与以往遇到的库大不相同. 比如,AngularJS暴露了一个全局对象:angu ...
随机推荐
- ClickOnce清单签名取消后依然读取证书的问题
在 http://www.cnblogs.com/heroius/p/8270004.html 和 http://www.cnblogs.com/heroius/p/8278796.html中,通过编 ...
- SpringBoot更改HttpMessageConverters使用FastJson出现乱码问题
1.出现问题的现象!如下截图,使用SpringBoot 进行开发,接口返回的内容出现中文乱码? 接口内容想要返回的内容: 页面返回内容: 惊喜不?意外不? 为什么出现这个情况?不例外的话,很多同事都是 ...
- Cxf 自动生成客户端服务端代码
第一步: 下载apache-cxf安装包.并安装. 第二步: 配置cxf的环境变量. CXF_HOME = "CXF安装路径". 例如:F:\apache-cxf-2.1.2 在P ...
- ELK日志收集平台部署
需求背景 由于公司的后台服务有三台,每当后台服务运行异常,需要看日志排查错误的时候,都必须开启3个ssh窗口进行查看,研发们觉得很不方便,于是便有了统一日志收集与查看的需求. 这里,我用ELK集群,通 ...
- 实验楼 -- (Linux)
1. 允许用户SSH登陆 # 打开ssh配置文件, 一般在/etc/ssh/sshd_config sudo vim /etc/ssh/sshd_config # 在文件最后添加: # 其中shiya ...
- Matlab绘图基础——其他三维图形(绘制填充的五角星)
其他三维图形 %绘制魔方阵的三维条形图 subplot(2,2,1); bar3(magic(4)); %以三维杆图形式绘制曲线y=2sin(x) subplot(2,2,2); y=2*sin( ...
- poj 3696 The Luckiest Number
The Luckiest Number 题目大意:给你一个int范围内的正整数n,求这样的最小的x,使得:连续的x个8可以被n整除. 注释:如果无解输出0.poj多组数据,第i组数据前面加上Case ...
- java开发常用技术
基础部分 1. 线程和进程的区别 线程三个基本状态:就绪.执行.阻塞 线程五个基本操作:创建.就绪.运行.阻塞.终止 进程四种形式:主从式.会话式.消息或邮箱机制.共享存储区方式 进程是具有一定功能的 ...
- 使用ADO.NET查询和操作数据
使用ADO.NET查询和操作数据 StringBuilder类: 用来定义可变字符串StringBuilder sb = new StringBuilder("");//追加字符串 ...
- present(模态)实现出push的效果
在present加上这个转场动画,取消掉原来的转场动画 CATransition *animation = [CATransitionanimation]; animation.durati ...