Angular在一個(gè)頁面中使用兩個(gè)ng-app的方法(二)
更新時(shí)間：2017年02月20日 15:26:14 作者：python基礎(chǔ)教程
這篇文章主要介紹了Angular在一個(gè)頁面中使用兩個(gè)ng-app的方法(二),非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
在上篇文章給大家介紹了Angular在一個(gè)頁面中使用兩個(gè)ng-app的方法，這種方法不太推薦，下面給大家介紹方法二，具體代碼如下所示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>ng-app指令,angular找到第一個(gè)ng-app就不會(huì)再找了，在一個(gè)頁面中只使用一個(gè)ng-app.</title>
</head>
<body ng-app="myApp">
<input type="button" ng-controller="App1Controller" ng-click="do1()" value="按鈕1" />
<input type="button" ng-controller="App2Controller" ng-click="do2()" value="按鈕2">
<script src="bower_components/angular/angular.js"></script>
<script>
var myApp1 = angular.module('myApp1', []);
myApp1.controller('App1Controller', ['$scope', function($scope){
$scope.do1 = function(){
console.log(11111);
};
}]);
var myApp2 = angular.module('myApp2', []);
myApp2.controller('App2Controller', ['$scope', function($scope){
$scope.do2 = function(){
console.log(22222);
};
}]);
/**
* myApp Mod'myApp1','myApp2'ul;
*
* Description
*/
angular.module('myApp', ['myApp1','myApp2']);
</script>
</body>
</html>
就是用一個(gè)大的模塊將兩個(gè)小模塊包起來。
以上所述是小編給大家介紹的Angular在一個(gè)頁面中使用兩個(gè)ng-app的方法(二)，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
AngularJS使用Filter自定義過濾器控制ng-repeat去除重復(fù)功能示例
這篇文章主要介紹了AngularJS使用Filter自定義過濾器控制ng-repeat去除重復(fù)功能,結(jié)合實(shí)例形式分析了AngularJS自定義過濾器的定義及數(shù)組過濾相關(guān)操作技巧,需要的朋友可以參考下2018-04-04
本篇文章主要介紹了angularJs指令的3種綁定策略，詳細(xì)的介紹了@=&的用法和實(shí)例，有興趣的可以了解一下。2017-04-04
這篇文章主要介紹了解析Angular 2+ 樣式綁定方式，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-01-01
Angular 理解module和injector，即依賴注入
本文主要介紹Angular 理解module和injector的知識(shí)，這里整理了相關(guān)知識(shí)，并詳細(xì)介紹了依賴注入的問題，有興趣的小伙伴可以參考下2016-09-09
這篇文章主要介紹了AngularJS 彈出框 $modal，大家都知道open是$modal唯一方法，通過本文給大家列出了該方法的屬性。對(duì)angularjs彈出框知識(shí)感興趣的朋友一起看下吧2016-08-08
Angular 數(shù)據(jù)請(qǐng)求的實(shí)現(xiàn)方法
本篇文章主要介紹了Angular 數(shù)據(jù)請(qǐng)求的實(shí)現(xiàn)方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-05-05
本篇文章主要介紹了AngularJS ng-repeat遍歷輸出的用法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-06-06
淺析如何利用angular結(jié)合translate為項(xiàng)目實(shí)現(xiàn)國際化
利用angular進(jìn)行國際化轉(zhuǎn)換時(shí)利用【ng-bind-html】來進(jìn)行語言的翻譯是接近幾乎比較完美的方案，不會(huì)像利用【{{}}】模式，當(dāng)頁面加載緩慢時(shí)導(dǎo)致頁面太丑。本文對(duì)其實(shí)現(xiàn)方法進(jìn)行介紹，有需要的朋友可以看下2016-12-12
這篇文章主要介紹了淺談Angular路由守衛(wèi),小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
淺析Angular 實(shí)現(xiàn)一個(gè)repeat指令的方法
這篇文章主要介紹了Angular 實(shí)現(xiàn)一個(gè)repeat指令的方法，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-07-07