对于一般的使用者来说,AngularJS的ng-app都是手动绑定到某个dom元素。但是在一些应用中,这样就显得很不方便了。

绑定初始化

通过绑定来进行angular的初始化,会把js代码侵入到html中,但是对于新手使用来说,还是足够了!

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl">
{{ hello }}
</div>
<script type="text/javascript">
var myModule = angular.module("myApp",[]);
myModule.controller("myCtrl",function($scope){
$scope.hello = "hello,angular!";
});
</script>
</body>
</html>

运行后,会显示hello,angular!

手动初始化

Angular中也提供了手动绑定的api——bootstrap,它的使用方式如下:

angular.bootstrap(element, [modules], [config]);

其中第一个参数element:是绑定ng-app的dom元素;

modules:绑定的模块名字

config:附加的配置

简单的看一下代码:

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
<body id="body">
<div ng-controller="myCtrl">
{{ hello }}
</div>
<script type="text/javascript">
var app = angular.module("bootstrapTest",[]);
app.controller("myCtrl",function($scope){
$scope.hello = "hello,angular from bootstrap";
}); // angular.bootstrap(document.getElementById("body"),['bootstrapTest']);
angular.bootstrap(document,['bootstrapTest']);
</script>
</body>
</html>

值得注意的是:

  • angular.bootstrap只会绑定第一次加载的对象。
  • 后面重复的绑定或者其他对象的绑定,都会在控制台输出错误提示。

AngularJS API之bootstrap启动的更多相关文章

  1. AngularJs学习笔记--bootstrap

    AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...

  2. 搭建angularjs API文档站点

    提供一个国内可以访问的 angularjs API文档站点 http://i.frllk.com/ 文档直接在 github 上下载的: https://github.com/angular-cn/n ...

  3. Tomcat8源码笔记(二)Bootstrap启动

    TOMCAT源码调试入口是Bootstrap类的main方法,我的启动参数VM: -Dcatalina.home=E:/Tomcat_Source_Code/apache-tomcat-8.0.53- ...

  4. 关于 supersocket 不能通过Bootstrap 启动

    App.config内容   <configSections> <section name="superSocket" type="SuperSocke ...

  5. aapt命令获取apk具体信息(包名、版本号号、版本号名称、兼容api级别、启动Activity等)

    aapt命令获取apk具体信息(包名.版本号号.版本号名称.兼容api级别.启动Activity等) 第一步:找到aapt 找到sdk的根文件夹,然后找到build-tools文件夹.然后会看到一些b ...

  6. 【16】AngularJS API

    AngularJS API API 意为 Application Programming Interface(应用程序编程接口). AngularJS 全局 API AngularJS 全局 API ...

  7. AngularJS中bootstrap启动

    对于一般的使用者来说,AngularJS的ng-app都是手动绑定到某个dom元素.但是在一些应用中,这样就显得很不方便了 绑定初始化 通过绑定来进行angular的初始化,会把js代码侵入到html ...

  8. AngularJS API

    AngularJS 全局 API 用于执行常见任务的 JavaScript 函数集合 angular.lowercase() 转换字符串为小写 angular.uppercase() 转换字符串为大写 ...

  9. Web APi 2.0优点和特点?在Web APi中如何启动Session状态?

    前言 曾几何时,微软基于Web服务技术给出最流行的基于XML且以扩展名为.asmx结尾的Web Service,此服务在.NET Framework中风靡一时同时也被.NET业界同仁所青睐,几年后在此 ...

随机推荐

  1. Jenkins 2.x版本的安装步骤(Windows)

    一.登录官网https://jenkins.io/index.html 二.选择LTS版本(长期支持的版本) 如果想要下载其它版本可以进入列表选择,在最顶部有操作系统可以选择 三.安装好后,第一次会进 ...

  2. CloudStack4.4安装 ubuntu14.04

    CloudStack 项目的活跃程度仅次于 OpenStack. 和大多数云计算.集群软件一样,CloudStack 也是控制节点+计算节点这种架构,控制节点(cloudstack-managemen ...

  3. fedora22有时不能启动

    [3.327871][drm:intel_set_pch_fifo_underrun_reporting [i915]] *ERROR* uncleared pch fifo underrun on ...

  4. CentOS加载U盘

    概述: 把CentOS设置成了启动进入命令行,结果不知道在哪儿找U盘了,于是搜集了一些命令. 1. 查看分区信息,以确定那个是U盘 使用root执行fdisk -l,确定U盘是sdb1 2. 挂载U盘 ...

  5. 常用RSS订阅地址

    随着Google Reader关门大吉,转战鲜果网了,RSS订阅地址经过几次折腾,丢的没剩几个了,写个文章记录一下吧,随时补充. --PS-- ,微信.微博之类的是社交平台,不能很好的梳理知识,一直用 ...

  6. C# 开源项目一

    商业协作和项目管理平台-TeamLab 网络视频会议软件-VMukti 驰骋工作流程引擎-ccflow [免费]正则表达式测试工具-Regex-Tester Windows-Phone-7-SDK E ...

  7. 数据库中Count是什么意思和SUM有什么区别?

    今天早上在做数据库的练习, 我是这样写的: 得出是: 后来才知道是: 结果是: 后来我意识到区别,于是查资料得到: 数据库中的count,是用来统计你查询出来的记录数,比如学生表中有十条记录:sele ...

  8. 64位centos下安装python的PIL模块

    http://blog.csdn.net/xiaojun1288/article/details/8673529

  9. spark 读取 elasticsearch数据

    –master spark://10.8.2.100:7077 –jars /usr/local/spark-1.5.2/lib/elasticsearch-hadoop-2.1.1.jar

  10. phpcms响应式布局导航条