Angular在一个页面中使用两个ng-app的方法(二)


Posted in Javascript onFebruary 20, 2017

在上篇文章给大家介绍了Angular在一个页面中使用两个ng-app的方法,这种方法不太推荐,下面给大家介绍方法二,具体代码如下所示:

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="utf-8">
  <title>ng-app指令,angular找到第一个ng-app就不会再找了,在一个页面中只使用一个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>

就是用一个大的模块将两个小模块包起来。

以上所述是小编给大家介绍的Angular在一个页面中使用两个ng-app的方法(二),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript面向对象之四 继承
Feb 08 Javascript
修改js Calendar日历控件 兼容IE9/谷歌/火狐
Jan 04 Javascript
javascript如何使用bind指定接收者
May 04 Javascript
解决jquery无法找到其他父级子集问题的方法
May 10 Javascript
微信小程序 animation API详解及实例代码
Oct 08 Javascript
BootStrap中Table隐藏后显示问题的实现代码
Aug 31 Javascript
dropload.js插件下拉刷新和上拉加载使用详解
Oct 20 Javascript
javascript原生封装一个淡入淡出效果的函数测试实例代码
Mar 19 Javascript
详解微信UnionID作用
May 15 Javascript
微信小程序自定义组件实现环形进度条
Nov 17 Javascript
Vue插件之滑动验证码
Sep 21 Javascript
js加减乘除精确运算方法实例代码
Jan 17 Javascript
Angular在一个页面中使用两个ng-app的方法
Feb 20 #Javascript
JS高仿抛物线加入购物车特效实现代码
Feb 20 #Javascript
ES6中Math对象的部分扩展
Feb 20 #Javascript
微信小程序左滑删除效果的实现代码
Feb 20 #Javascript
JavaScript轮播图简单制作方法
Feb 20 #Javascript
Ajax异步获取html数据中包含js方法无效的解决方法
Feb 20 #Javascript
原生js实现放大镜
Feb 20 #Javascript
You might like
php利用scws实现mysql全文搜索功能的方法
2014/12/25 PHP
PHP使用redis位图bitMap 实现签到功能
2019/10/08 PHP
用于自动添加Digg This!按钮的JavaScript
2006/12/23 Javascript
for 循环性能比较 提高for循环的效率
2009/03/19 Javascript
jquery中的on方法使用介绍
2013/12/29 Javascript
百度坐标(BD09)、国测局坐标(火星坐标,GCJ02)、和WGS84坐标系之间的转换
2016/02/19 Javascript
浅谈DOCTYPE对$(window).height()取值的影响
2016/07/21 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
微信小程序 合法域名校验出错详解及解决办法
2017/03/09 Javascript
Vue.js数据绑定之data属性
2017/07/07 Javascript
提高Node.js性能的应用技巧分享
2017/08/10 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
JavaScript中变量、指针和引用功能与操作示例
2018/08/04 Javascript
微信小程序Getuserinfo解决方案图解
2018/08/24 Javascript
详解Vue2.5+迁移至Typescript指南
2019/08/01 Javascript
vue中使用v-model完成组件间的通信
2019/08/22 Javascript
webpack proxy 使用(代理的使用)
2020/01/10 Javascript
jquery实现简单拖拽效果
2020/07/20 jQuery
教你用Type Hint提高Python程序开发效率
2016/08/08 Python
Python数字图像处理之霍夫线变换实现详解
2018/01/12 Python
numpy 进行数组拼接,分别在行和列上合并的实例
2018/05/08 Python
python处理两种分隔符的数据集方法
2018/12/12 Python
利用Python实现kNN算法的代码
2019/08/16 Python
详解Python文件修改的两种方式
2019/08/22 Python
python 实用工具状态机transitions
2020/11/21 Python
python之随机数函数的实现示例
2020/12/30 Python
Python3自带工具2to3.py 转换 Python2.x 代码到Python3的操作
2021/03/03 Python
说一下mysql, oracle等常见数据库的分页实现方案
2012/09/29 面试题
升国旗仪式主持词
2014/03/19 职场文书
事业单位竞聘上岗实施方案
2014/03/28 职场文书
优秀的个人求职信范文
2014/05/09 职场文书
网球场地租赁协议范本
2014/10/07 职场文书
教师师德师风整改措施
2014/10/24 职场文书
tensorflow学习笔记之tfrecord文件的生成与读取
2021/03/31 Python
详解Laravel框架的依赖注入功能
2021/05/27 PHP
介绍一下28个JS常用数组方法
2022/05/06 Javascript