在传统的angularJS应用中,都是通过ng-app把angular应用绑定到某个dom上,这样做会把js代码入侵到html上,angular提供了手动启动的API--angular.bootstrap()。

 

 传统的绑定初始化

<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>

  

  手动初始化

angular.bootstrap(element, [appName], [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']); // 浏览器加载的每个html都会对应一个document对象, 此对象是所有html中dom元素的根节点,也属于dom元素
</script>
</body>
</html>

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

初始化angularJS之ng-app的自动绑定和手动绑定的更多相关文章

  1. cocos2dx lua 绑定之二:手动绑定自定义类中的函数

    cococs2dx 3.13.1 + vs2013 + win10 1.首先按照<cocos2dx lua 绑定之一:自动绑定自定义类>绑定Student类 2.在Student类中增加一 ...

  2. 如何实现已发布app的自动更新

    要实现app的自动更新,做两件事情就可以搞定 1.获取当前手机中的app版本号 我们可以通过查询mainbundle中的获取CFBundleVersion NSDictionary *infoDict ...

  3. 【Angular 5】数据绑定、事件绑定和双向绑定

    本文为Angular5的学习笔记,IDE使用Visual Studio Code,内容是关于数据绑定,包括Property Binding.Class Binding.Style Binding. 在 ...

  4. 类属性与对象实现,init方法的作用,绑定方法,绑定方法与普通函数的区别,继承,抽象与继承,派生与覆盖

    今日内容: 1.类属性与对象属性 2.init方法的作用 3.绑定方法 4.绑定方法与普通函数的区别(非绑定方法) 5.继承 6.抽象与继承 7.派生与覆盖 1.类属性与对象属性 类中应该进存储所有对 ...

  5. 背水一战 Windows 10 (21) - 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧

    [源码下载] 背水一战 Windows 10 (21) - 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧 作者:webabcd 介绍背水一战 Wind ...

  6. vb小菜一枚--------早期绑定和后期绑定

    早期绑定和后期绑定 Visual Studio 2005   其他版本   将对象分配给对象变量时,Visual Basic 编译器会执行一个名为 binding 的进程.如果将对象分配给声明为特定对 ...

  7. KnockoutJS 3.X API 第四章 表单绑定(9) value绑定

    目的 value绑定主要用于DOM元素给视图模型赋值用的.通常用于<input><select><textarea>等元素. value绑定与text绑定的区别在于 ...

  8. 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧

    背水一战 Windows 10 之 绑定 x:Bind 绑定 x:Bind 绑定之 x:Phase 使用绑定过程中的一些技巧 示例1.演示 x:Bind 绑定的相关知识点Bind/BindDemo.x ...

  9. IOS6屏幕旋转详解(自动旋转、手动旋转、兼容IOS6之前系统)

    转自 http://blog.csdn.net/zzfsuiye/article/details/8251060 概述: 在iOS6之前的版本中,通常使用 shouldAutorotateToInte ...

随机推荐

  1. 重装Win10系统的非常简单的操作教程

    这是回到学校的第二天,准备搞一份实习证明,然而宿舍宽带停了,于是我来到了社团办公室,打开了其中一台电脑. 各位师弟师妹...你们也太厉害,把电脑折腾成这样...电脑装了各种各样的工具, Adobe P ...

  2. 利用Apache配置本地 自定义域名

    第一步:配置 httpd.conf 开启 虚拟主机 配置模块 去掉 " Include conf/extra/httpd-vhosts.conf " 前面的" # &qu ...

  3. myeclipse8.5打包jar并引入第三方jar包

    用myeclipse自带的export工具,无法引入被引用的第三方的jar包,有两种方式: (1)直接export出jar包,解压jar包(第三方的jar包太多,太麻烦) 在创建好的JAR文件里找到M ...

  4. Hadoop1.x原理

    将这种单机的工作进行分拆,变成协同工作的集群,这就是分布式计算框架设计.使得计算机硬件类似于应用程序中资源池的资源,使用者无需关心资源的分配情况,从而最大化了硬件资源的使用价值.分布式计算也是如此,具 ...

  5. 小说接入UC浏览器内核技术对话(一)

    质辛@灿岩 质辛跟我们说一下那个删除文件的逻辑吧质辛@灿岩  应该不是删除cache下所有文件吧?质辛@智鹰  提供一下我们的临时文件完整路径给 灿岩吧质辛@智鹰  是负责我们ucsdk的 技术对接灿 ...

  6. linux之x86裁剪移植---ffmpeg的H264解码显示(420、422)

    在虚拟机上yuv420可以正常显示 ,而945(D525)模块上却无法显示 ,后来验证了directdraw的yuv420也无法显示 ,由此怀疑显卡不支持 ,后把420转换为422显示. 420显示如 ...

  7. 嵌入式linux------SDL移植(am335x下显示bmp图片)

    #include<stdio.h> #include "/usr/local/ffmpeg_arm/include/SDL/SDL.h" char *bmp_name[ ...

  8. pat1071-1080

    1071 #include<iostream> #include<cstdio> #include<cstring> #include<vector> ...

  9. .Net Core下 Redis的String Hash List Set和Sorted Set的例子

    1.新建一个.Net Core控制台应用程序,用Nuget导入驱动 打开程序包管理控制台, 执行以下代码. PM> Install-Package ServiceStack.Redis 即可添加 ...

  10. RSS简介

    1.RSS(Really Simple Syndication)简介 1.定义     对于网站:RSS 是一种使用 XML 向许多其他的网站分发自己网站上的网络内容的方法.     对于用户:RSS ...