angularjs1-3,工具方法,bootstrap,多个module,引入jquery

<!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  ng-controller="firstController"
        {{name}}
    </div>
    <div    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 >
        </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>