angular.extend、angular.$watch、angular.bootstrap
1、angular.extend:依次將第二個參數及後續的參數的第一層屬性（不管是簡單屬性還是對象）拷貝給第一個參數的第一層屬性，即如果是對象，則是引用的是同一個對象，並返回第一個參數對象。
直接上代碼來的簡單明了：
<script type="text/javascript" src="js/angular.min.js" ></script>
<script type="text/javascript">
var json= {
name:‘jsck‘,
age:20
}
var json1 = {
sex:‘men‘
}
var c = angular.extend(json,json1);
console.log(c)
</script>
返回的結果：
Object {name: "jsck", age: 20, sex: "men"}
angular.extend方法就介紹到這裏。
2.angular.$watch,當你數據中的某一部分發生了變化時，$watch函數就可以發出通知，監控那部分數據。
下面來看下實例吧
<!DOCTYPE html>
<html ng-app="mk">
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module(‘mk‘, []);
app.controller(‘ctrl‘, function($scope) {
$scope.init = {
name: "jack",
age: 20
};
$scope.$watch(‘init.age‘, function(newVal, oldVal) {
console.log("new--" + newVal);
console.log("old--" + oldVal);
}, true)
})
</script>
</head>
<body ng-controller="ctrl">
user:<input type="text" ng-model="init.name"/> age:
<input type="number" ng-model="init.age" />
</body>
</html>
在網頁中展現的效果：
看一下監聽到的內容：
3、angular.bootstrap,此方法用於手動加載angularjs模塊。
angular.bootstrap(element, [modules], [config]);
| 參數名稱 | 參數類型 | 描述 |
|---|---|---|
| element | DOMElement | DOM元素 |
| modules | Array | 要加載的模板 |
| config | Object | 配置選項的對象。 |
說多無益，直接看代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript">
var app1 = angular.module(‘mk1‘, []);
var app2 = angular.module(‘mk2‘, []);
app1.controller("ctrl1", function($scope) {
$scope.a = 12;
})
app2.controller("ctrl2", function($scope) {
$scope.b = 20;
})
var aDiv = document.getElementsByTagName(‘div‘);
angular.element(document).on(‘click‘, function() {
angular.bootstrap(aDiv[0], [‘mk1‘]); //手動開啟angular應用模式，第一個參數是定義哪個模塊
angular.bootstrap(aDiv[1], [‘mk2‘]);
})
</script>
</head>
<body>
<div ng-controller="ctrl1">
{{a}}
</div>
<div ng-controller="ctrl2">
{{b}}
</div>
</body>
</html>
在網頁中剛出來的效果是這樣的
然後手動點擊{{a}}、{{b}}
最後展示效果
angular.extend、angular.$watch、angular.bootstrap