<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>无标题文档</title>

        <script type="text/javascript" src="angular.min.js"></script>

    </head>

    <body>

      <div ng-app="myApp">

          <div ng-controller="firstController">

              {{name}}

              {{isArray}}

              {{name1}}

              {{eq}}

          </div>

      </div>

      <script type="text/javascript">

          var app = angular.module("myApp", []);

          app.controller('firstController',['$scope',function($scope){

              /*$scope.name='zhangsan';

              $scope.arr=[1,2,3];

              $scope.isArray=angular.isArray($scope.arr);

              $scope.name1=angular.uppercase($scope.name);

              $scope.a='111';

              $scope.b='111';

              $scope.eq=angular.equals($scope.a,$scope.b);

              console.log($scope.eq);//true

              $scope.a={name:'张三'};

              $scope.b={age:10};

              $scope.c=angular.extend($scope.b,$scope.a);

              console.log($scope.c);//Object {age: 10, name: "张三"}

              var json = {"name":"hello","age":"20"};

              console.log(json);//Object {name: "hello", age: "20"}

              $scope.json=angular.toJson(json);

              console.log($scope.json);//{"name":"hello","age":"20"}

              $scope.json=angular.toJson(json,true);

              console.log($scope.json);

              var json = '{"name":"hello","age":"20"}';

              console.log(json);//{"name":"hello","age":"20"}

              $scope.json=angular.toJson(json);

              $scope.json=angular.fromJson(json);

              console.log($scope.json);//Object {name: "hello", age: "20"}

              $scope.a={name:'张三'};

              $scope.b={age:10};

              $scope.c=angular.copy($scope.a,$scope.b);

              console.log($scope.a);

              console.log($scope.b);

              var json = {"name":"hello","age":"20","sex":'男'};

              angular.forEach(json,function(val,key){

                  console.log(val);

                  console.log(key);

              });*/

              var json = {"name":"hello","age":"20","sex":'男'};

              var results=[];

              angular.forEach(json,function(val,key){

                  console.log(val);

                  console.log(key);

                  this.push(key+'--'+val);

              },results);

              console.log(results);

              //绑定对象，作为函数的上下文

              var self={name:'张三'};

              var f=angular.bind(self,function(age){

                $scope.info=this.name+' is '+age;

                console.log($scope.info);

              });

              f(30);

              var f=angular.bind(self,function(age){

                  $scope.info=this.name+' is '+age;

                  console.log($scope.info);

              },10);

              f();

          }]);

      </script>

    </body>

</html>
<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>无标题文档</title>

    <script type="text/javascript" src="angular.min.js"></script>

</head>

<body>

<div>

   <!--  <div ng-controller="firstController" ng-app="myApp1">

        {{name}}

    </div>

    <div ng-controller="secondController" ng-app="myApp2">

        {{name}}

    </div>

    var app1 = angular.module("myApp1", []);

    var app2 = angular.module("myApp2",  []);//报错，module只会初始化一次， -->

    <div id='div1' ng-controller="firstController"

        {{name}}

    </div>

    <div  id='div2'  ng-controller="secondController">

        {{name}}

    </div>

</div>

//bootstrap不是css的bootstrap，一般一个页面只有一个module，bootstrap用于页面初始化多个module，

<script type="text/javascript">

    var app1 = angular.module("myApp1", []);

    var app2 = angular.module("myApp2", []);//报错，module只会初始化一次，

    app1.controller('firstController',function($scope){

        $scope.name='张三';

    });

    app2.controller('secondController',function($scope){

        $scope.name='李四';

    });

    var div1=document.getElementById('div1');

    var div2=document.getElementById('div2');

    document.onclick=function(){//动态加载多个module

        angular.bootstrap(div1,['myApp1']);

        angular.bootstrap(div2,['myApp2']);

    }

</script>

</body>

</html>
<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>无标题文档</title>

    <script type="text/javascript" src="angular.min.js"></script>

    <script type="text/javascript" src="module02.js"></script>

<!-- module02.js：

var app2 = angular.module("myApp2", []);

app2.controller('secondController',function($scope){

    $scope.name='李四';

});

app2.controller('threeController',function($scope){

    $scope.name='王五';

});-->

</head>

<body ng-app="myApp">

<div>

    <div ng-controller="firstController">

        {{name}}

    </div>

    <div ng-controller="secondController">

        {{name}}

    </div>

    <div ng-controller="threeController">

        {{name}}

    </div>

</div>

<script type="text/javascript">

    var app1 = angular.module("myApp", ['myApp2'])//模块的依赖，['myApp2','myApp3']可以引入多个，这是插件化引入。

    app1.controller('firstController',function($scope){

        $scope.name='张三';

    });

</script>

</body>

</html>
<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>无标题文档</title>

    //jqueru要放在上面

    <script type="text/javascript" src="jquery-1.11.1.js"></script>

    <script type="text/javascript" src="angular.min.js"></script>

    <script type="text/javascript" src="module02.js"></script>

<!-- module02.js：

var app2 = angular.module("myApp2", []);

app2.controller('secondController',function($scope){

    $scope.name='李四';

});

app2.controller('threeController',function($scope){

    $scope.name='王五';

});-->

</head>

<body ng-app="myApp">

<div>

    <div ng-controller="firstController">

        <div id="obj1">

        </div>

        {{name}}

    </div>

    <div   ng-controller="secondController">

        {{name}}

    </div>

    <div   ng-controller="threeController">

        {{name}}

    </div>

</div>

<script type="text/javascript">

    var app1 = angular.module("myApp", ['myApp2']);

    app1.controller('firstController',function($scope){

        $scope.name='张三';

       // $("#obj1").html('<span>尿道嗦嘎电视柜 v邓先生广东省高</span>');

           var obj1=document.getElementById('obj1');

            angular.element(obj1).html('这是angularjs中的jqlite');

    });

</script>

</body>

</html>

angularjs1-3,工具方法，bootstrap，多个module，引入jquery的更多相关文章

  1. jquery源码解析：jQuery延迟对象Deferred（工具方法）详解1

    请先看上一课的回调对象.Deferred是通过extend添加到jQuery中的工具方法.如下所示: jQuery.extend({ Deferred: function( func ) { }, w ...

  2. angularjs工具方法

    1.angular.extend var dst = {name: 'xxx', country: 'China'}; var src1 = {name: 'yyy', age: 10}; var s ...

  3. angular的工具方法笔记(equals, HashKey)

    分别是angular脏值检测的工具方法equals和 类HashKey的使用方法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transi ...

  4. 秒味课堂Angular js笔记------Angular js中的工具方法

    Angular js中的工具方法 angular.isArray angular.isDate angular.isDefined angular.isUndefined angular.isFunc ...

  5. JQuery操作类数组的工具方法

    JQuery学习之操作类数组的工具方法 在很多时候,JQuery的$()函数都返回一个类似数据的JQuery对象,例如$('div')将返回div里面的所有div元素包装的JQuery对象.在这中情况 ...

  6. jQuery工具方法

    目录 常用工具方法 判断数据类型的方法 Ajax操作 $.ajax 简便写法 Ajax事件 返回值 JSONP 文件上传 参考链接 jQuery函数库提供了一个jQuery对象(简写为$),这个对象本 ...

  7. jQuery晦涩的底层工具方法们

    这里整理的是jQuery源码中一些比较晦涩难懂的.内部的.最底层的工具方法,它们多为jQuery的上层api方法服务,目前包括: jQuery.access jQuery.access: functi ...

  8. zepto源码学习-02 工具方法-详细解读

    上一篇:地址 先解决上次留下的疑问,开始看到zepto.z[0]这个东西的时候,我很是不爽,看着它都不顺眼,怎么一个zepto的实例对象var test1=$('#items');  test__pr ...

  9. jQuery源代码 解析一 工具方法

    1. 外层沙箱以及命名空间$ 几乎稍微有点经验前端人员都这么做,为了避免声明了一些全局变量而污染,把代码放在一个"沙箱执行",然后在暴露出命名空间(可以为API,函数,对象): 2 ...

  10. Underscore.js 常用类型判断以及一些有用的工具方法

    1. 常用类型判断以及一些有用的工具方法 underscore.js 中一些 JavaScript 常用类型检查方法,以及一些工具类的判断方法. 首先我们先来谈一谈数组类型的判断.先贴出我自己封装好的 ...

随机推荐

  1. ASP.NET 微信公众平台模板消息推送功能完整开发

    最近公众平台的用户提出了新需求,他们希望当收到新的邮件或者日程的时候,公众平台能主动推送一条提醒给用户.看了看平台提供的接口,似乎只有[模板消息]能尽量满足这一需求,但不得不说微信提供的实例太少,而且 ...

  2. 高级I/O函数

    给套接口上的I/O设置超时 1.调用alarm,在调用超过指定时间时产生SIGALARM信号,这涉及到信号处理,而且可能和进程中其他的alarm冲突 2.使用select阻塞在等待I/O上,selec ...

  3. 5 Python+Selenium的元素定位方法（xpath）

    [环境] Python3.6+selenium3.0.2+FireFox50+win7 [定位方法] 1.方法:find_element_by_xpath('') 说明:xpath定位方法有相对路径和 ...

  4. 杭电 2095 find your present (2)【位运算 异或】

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2095 解题思路:因为只有我们要求的那个数出现的次数为奇数,所以可以用位运算来做,两次异或同一个数最后结 ...

  5. 【从零开始】【Java】【0】装软件些

    闲聊 其实最先写的是1,所以拐回头写的只能是0了. 因为要在不同的电脑上搞这个东西,必然涉及到装机,当然只是装我们用的这些,且是最基础的部分了. 大晚上的睡不着觉,起来,大概1个小时全部搞定,随便记下 ...

  6. 【前端分享】jQuery.lazyload详解（转）

    jQuery实现图片延迟加载,不知道是否可以节省带宽呢?有人知道吗?这究竟只是一个视觉特效还是真的能延迟加载减少服务器的请求呢? <script type="text/javascri ...

  7. .apply .call方法的区别及使用 .apply第二个参数为数组,.call第二个参数为参数列表, 相同点:第一个参数都为Function函数内部的this对象.

    Function.apply(obj,args)方法能接收两个参数 obj:这个对象将代替Function类里this对象 args:这个是数组,它将作为参数传给Function(args--> ...

  8. java操作Excel的poi基础语法

    创建一个简单的实列 package com.java.poi; import org.apache.poi.hssf.usermodel.HSSFWorkbook; import org.apache ...

  9. [luogu1463 HAOI2007] 反素数 (约数)

    传送门 Description 对于任何正整数x,其约数的个数记作g(x).例如g(1)=1.g(6)=4. 如果某个正整数x满足:g(x)>g(i) 0<i<x,则称x为反质数.例 ...

  10. 【LibreOJ 6279】 数列分块入门 3 （分块）

    传送门 code: //By Menteur_Hxy #include<cstdio> #include<iostream> #include<algorithm> ...