• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > AngularJS使用angular.bootstrap完成模块手动加载的方法分析

AngularJS使用angular.bootstrap完成模块手动加载的方法分析

作者:aitangyong 字体:[增加 减小] 来源:互联网 时间:2017-05-11

aitangyong通过本文主要向大家介绍了angularjs与angular2,angular和angularjs,angularjs bootstrap,angular bootstrap,angular ui bootstrap等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

本文实例分析了AngularJS使用angular.bootstrap完成模块手动加载的方法。分享给大家供大家参考,具体如下:

之前我们看到使用ng-app指令,可以实现模块的自动加载。现在我们看下,angular中如何手动加载模块。需要使用到angular.bootstrap这个函数。

<html>
  <head>
    <script src="angular.js"></script>
    <script>
    // 创建moudle1
    var rootMoudle = angular.module('moudle1', []);
    rootMoudle.controller("controller1",function($scope){$scope.name="aty"});
    // 创建moudle2
    var m2 = angular.module('moudle2', []);
    m2.controller("controller2",function($scope){$scope.name="aty"});
    // 页面加载完成后,再加载模块
    angular.element(document).ready(function() {
      angular.bootstrap(document.getElementById("div1"),["moudle1"]);
      angular.bootstrap(document.getElementById("div2"),["moudle2"]);
    });
  </script>
  <head>
  <body>
    <div id="div1" ng-controller="controller1">div1:{{name}}</div>
    <div id="div2" ng-controller="controller2">div2:{{name}}</div>
  </body>
</html>

</div>

IE运行这个网页,发现变量能够被angular框架正确解析;F12发现控制台也没有报错误。到这里为止,我们知道了如何加载angular的模块,也明白了手动加载和自动加载的区别。接下来,我们就可以去继续学习AngularJS框架的其他知识。

更多关于AngularJS相关内容感兴趣的读者可查看本站专题:《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》

希望本文所述对大家AngularJS程序设计有所帮助。

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • AngularJS使用angular.bootstrap完成模块手动加载的方法分析

相关文章

  • 2017-05-11JS实现css hover操作的方法示例
  • 2017-05-11javascript实现多张图片左右无缝滚动效果
  • 2017-05-11JS实现的DIV块来回滚动效果示例
  • 2017-05-11微信小程序模板之分页滑动栏
  • 2017-05-11URL中“#” “?” &“”号的作用浅析
  • 2017-05-11AngularJs 利用百度地图API 定位当前位置 获取地址信息
  • 2017-05-11ajax接收后台数据在html页面显示
  • 2017-05-11prototype与__proto__区别详细介绍
  • 2017-05-11jQuery实现简单的抽奖游戏
  • 2017-05-11提高JavaScript执行效率的23个实用技巧

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 基于vue的fullpage.js单页滚动插件
    • Angular组件化管理实现方法分析
    • nodeJs链接Mysql做增删改查的简单操作
    • jQuery基于正则表达式的表单验证功能示例
    • jQuery插件zTree实现更新根节点中第i个节点名称的方法示例
    • jQuery插件ajaxFileUpload使用详解
    • JavaScript实现获取远程的html到当前页面中
    • canvas绘制的直线动画
    • js实现简单的网页换肤效果
    • Canvas实现动态的雪花效果

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有