Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法(二)

更新時(shí)間：2017年02月20日 15:26:14 作者：python基礎(chǔ)教程

這篇文章主要介紹了Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法(二),非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下

在上篇文章給大家介紹了Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法，這種方法不太推薦，下面給大家介紹方法二，具體代碼如下所示：

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="utf-8">
  <title>ng-app指令,angular找到第一個(gè)ng-app就不會(huì)再找了，在一個(gè)頁(yè)面中只使用一個(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è)小模塊包起來(lái)。

以上所述是小編給大家介紹的Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法(二)，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

Angular2自定義分頁(yè)組件
本篇文章主要介紹了Angular2自定義分頁(yè)組件的相關(guān)知識(shí)。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
2017-04-04
Angular企業(yè)級(jí)開(kāi)發(fā)——MVC之控制器詳解
本篇文章主要介紹了Angular企業(yè)級(jí)開(kāi)發(fā)——MVC之控制器詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-02-02
AngularJS $modal彈出框?qū)嵗a
這篇文章主要介紹了AngularJS 彈出框 $modal，大家都知道open是$modal唯一方法，通過(guò)本文給大家列出了該方法的屬性。對(duì)angularjs彈出框知識(shí)感興趣的朋友一起看下吧
2016-08-08
Angular2表單自定義驗(yàn)證器的實(shí)現(xiàn)
本文給大家介紹angular2表單自定義驗(yàn)證器的實(shí)現(xiàn)，本文給大家介紹的非常詳細(xì)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧
2016-10-10
angular同一頁(yè)面跳轉(zhuǎn)重新執(zhí)行的實(shí)現(xiàn)方法
這篇文章主要介紹了angular同一頁(yè)面跳轉(zhuǎn)重新執(zhí)行的實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2023-11-11
AngularJS基于provider實(shí)現(xiàn)全局變量的讀取和賦值方法
這篇文章主要介紹了AngularJS基于provider實(shí)現(xiàn)全局變量的讀取和賦值方法,結(jié)合實(shí)例形式分析了AngularJS全局變量的聲明、賦值、讀取等相關(guān)使用技巧,需要的朋友可以參考下
2017-06-06
Angular中使用ui router實(shí)現(xiàn)系統(tǒng)權(quán)限控制及開(kāi)發(fā)遇到問(wèn)題
這篇文章主要介紹了Angular中使用ui router實(shí)現(xiàn)系統(tǒng)權(quán)限控制及開(kāi)發(fā)遇到問(wèn)題的相關(guān)資料,本文分步驟介紹的非常詳細(xì)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-09-09
基于AngularJS的簡(jiǎn)單使用詳解
下面小編就為大家?guī)?lái)一篇基于AngularJS的簡(jiǎn)單使用詳解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就想給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
Augularjs-起步詳解
下面小編就為大家?guī)?lái)一篇Augularjs-起步詳解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-07-07
詳解基于Bootstrap+angular的一個(gè)豆瓣電影app
本篇文章主要介紹了基于Bootstrap+angular的一個(gè)豆瓣電影app ，非常具有實(shí)用價(jià)值，需要的朋友可以參考下
2017-06-06