首页 > 代码库 > AngularJs学习笔记7——四大特性之模块化设计

AngularJs学习笔记7——四大特性之模块化设计

模块化设计

1.引用自定义模块并调用

         自定义模块中,如果有一些服务、封装好笑模块,在另外一个模块中(声明的时候,在依赖列表中加入要引入的模块)

var app02 = angular.module(‘fan02‘,[‘ng‘,‘fan‘]);

就调用fan02模块中所定义的东西

 

2.ng内置的模块的用法

         (1) ngRoute模块(路由模块)

                   AngularJS是一个开源的js框架。用在数据操作比较频繁的场景下,用于SPA应用

 

  单页面应用的工作原理:

         1.页面url:http://127.0.0.1/index.html#/路由地址

         2.浏览器首先解析基础页面index.html,再解析路由地址

         3.查找路由词典,#/startàstart.html#/mainàmain.html

         4.得到当前url中路由地址所对应的真实模板页面地址

         5.发起ajax请求,获取目标模板页面,插入到当前的DOM树

 

  使用ngRoute来实现SPA的步骤

         1.创建一个完整的HTML页面,引入angular.js、angular-route.js

         2.创建自定义模块,在依赖列表中依赖ng,ngRoute        

         3.在index.html的body中声明一个容器(盛放代码片段)

                   实现方式:使用ngView指令声明一个容器

         4.创建代码片段

         5.配置路由词典

                   $routeProvider.when(‘/start’,{templateUrl:‘start.html’});

         6.测试

示例:明早重新修正笔记

AngularJs学习笔记7——四大特性之模块化设计