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 相关文章推荐
jquery判断checkbox(复选框)是否被选中的代码
Oct 20 Javascript
jquery禁止回车触发表单提交
Dec 12 Javascript
使用jQuery简单实现模拟浏览器搜索功能
Dec 21 Javascript
jQuery中extend函数详解
Feb 13 Javascript
Vue.js路由组件vue-router使用方法详解
Dec 02 Javascript
js css自定义分页效果
Feb 24 Javascript
react-router中的属性详解
Jun 01 Javascript
纯JS实现简单的日历
Jun 26 Javascript
微信小程序Getuserinfo解决方案图解
Aug 24 Javascript
JS实现Cookie读、写、删除操作工具类示例
Aug 28 Javascript
vue 实现移动端键盘搜索事件监听
Nov 06 Javascript
小程序跨页面交互的作用与方法详解
Jan 07 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数组转换js数组操作及json_encode的用法详解
2013/10/26 PHP
JScript中使用ADODB.Stream判断文件编码的代码
2008/06/09 Javascript
javascript下IE与FF兼容函数收集
2008/09/17 Javascript
jquery如何判断表格同一列不同行input数据是否重复
2014/05/14 Javascript
jquery 表格排序、实时搜索表格内容(附图)
2014/05/19 Javascript
JQuery实现的按钮倒计时效果
2015/12/23 Javascript
AngularJS实现给动态生成的元素绑定事件的方法
2016/12/14 Javascript
关于vue.js v-bind 的一些理解和思考
2017/06/06 Javascript
Node.js 回调函数实例详解
2017/07/06 Javascript
JS库中的Particles.js在vue上的运用案例分析
2017/09/13 Javascript
JSON.stringify()方法讲解
2019/01/31 Javascript
使用JavaScript解析URL的方法示例
2019/03/01 Javascript
Vue响应式原理Observer、Dep、Watcher理解
2019/06/06 Javascript
mpvue 页面预加载新增preLoad生命周期的两种方式
2019/10/17 Javascript
微信公众号中的JSSDK接入及invalid signature等常见错误问题分析(全面解析)
2020/04/11 Javascript
利用Vue实现简易播放器的完整代码
2020/12/30 Vue.js
Python 2.7.x 和 3.x 版本的重要区别小结
2014/11/28 Python
简单介绍Python中的readline()方法的使用
2015/05/24 Python
设计模式中的原型模式在Python程序中的应用示例
2016/03/02 Python
详解Python中的变量及其命名和打印
2016/03/11 Python
Python语言进阶知识点总结
2019/05/28 Python
在python tkinter中Canvas实现进度条显示的方法
2019/06/14 Python
python+mysql实现个人论文管理系统
2019/10/25 Python
基于plt.title无法显示中文的快速解决
2020/05/16 Python
Keras在训练期间可视化训练误差和测试误差实例
2020/06/16 Python
django模型类中,null=True,blank=True用法说明
2020/07/09 Python
python openCV实现摄像头获取人脸图片
2020/08/20 Python
python爬虫scrapy框架的梨视频案例解析
2021/02/20 Python
澳大利亚办公室装修:JasonL Office Furniture
2019/06/25 全球购物
俄罗斯韩国化妆品网上商店:Cosmasi.ru
2019/10/31 全球购物
RIP版本1跟版本2的区别
2013/12/30 面试题
2014年小学数学工作总结
2014/12/12 职场文书
音乐教师个人工作总结
2015/02/06 职场文书
助学金申请书该怎么写?
2019/07/16 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
html,css,javascript是怎样变成页面的
2023/05/07 HTML / CSS