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.simple.tree插件 更简单,兼容性更好的无限树插件
Sep 03 Javascript
读jQuery之一(对象的组成)
Jun 11 Javascript
在JavaScript中typeof的用途介绍
Apr 11 Javascript
防止浏览器记住用户名及密码的简单实用方法
Apr 22 Javascript
运用jQuery定时器的原理实现banner图片切换
Oct 22 Javascript
jQuery实现宽屏图片轮播实例教程
Nov 24 Javascript
Bootstrap基本组件学习笔记之按钮组(8)
Dec 07 Javascript
详解Angular4中路由Router类的跳转navigate
Jun 09 Javascript
使用 vue.js 构建大型单页应用
Feb 10 Javascript
轻量级JS Cookie插件js-cookie的使用方法
Mar 22 Javascript
vue和小程序项目中使用iconfont的方法
May 19 Javascript
MutationObserver在页面水印实现起到的作用详解
Jul 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的FTP学习(二)[转自奥索]
2006/10/09 PHP
php实现的一个简单json rpc框架实例
2015/03/30 PHP
Thinkphp 中 distinct 的用法解析
2016/12/14 PHP
关于laravel 日志写入失败问题汇总
2019/10/17 PHP
PHP加MySQL消息队列深入理解
2021/02/27 PHP
JS中==与===操作符的比较
2009/03/21 Javascript
JavaScript打开word文档的实现代码(c#)
2012/04/16 Javascript
javascript中有趣的反柯里化深入分析
2012/12/05 Javascript
javascript打开word文档的方法
2014/04/16 Javascript
上传图片预览JS脚本 Input file图片预览的实现示例
2014/10/23 Javascript
Jquery实现textarea根据文本内容自适应高度
2015/04/03 Javascript
jQuery中选择器的基础使用教程
2016/05/23 Javascript
简单谈谈关于Angular Cli打包的事
2017/09/05 Javascript
jQuery使用bind函数实现绑定多个事件的方法
2017/10/11 jQuery
JavaScript登录验证基础教程
2017/11/01 Javascript
LayUi中接口传数据成功,表格不显示数据的解决方法
2018/08/19 Javascript
利用React Router4实现的服务端直出渲染(SSR)
2019/01/07 Javascript
JS判断数组是否包含某元素实现方法汇总
2020/06/24 Javascript
Python strip lstrip rstrip使用方法
2008/09/06 Python
用python写一个windows下的定时关机脚本(推荐)
2017/03/21 Python
深入理解Django的中间件middleware
2018/03/14 Python
深入浅析python with语句简介
2018/04/11 Python
Python中拆分字符串的操作方法
2019/07/23 Python
用Python实现校园通知更新提醒功能
2019/11/23 Python
django框架ModelForm组件用法详解
2019/12/11 Python
Python 字符串处理特殊空格\xc2\xa0\t\n Non-breaking space
2020/02/23 Python
python读取当前目录下的CSV文件数据
2020/03/11 Python
python3环境搭建过程(利用Anaconda+pycharm)完整版
2020/08/19 Python
python利用paramiko实现交换机巡检的示例
2020/09/22 Python
Myprotein瑞士官方网站:运动营养和健身网上商店
2019/09/25 全球购物
美国眼镜在线零售商:Dualens
2019/12/07 全球购物
EJB的角色和三个对象
2015/12/31 面试题
线程同步的方法
2016/11/23 面试题
新生开学寄语大全
2015/05/28 职场文书
2019年感恩励志演讲稿(收藏备用)
2019/09/11 职场文书
vue3中的组件间通信
2021/03/31 Vue.js