时间:2021-05-28
在前面的几个文章中,我们的数据都是以函数的方式定义在全局的作用域下,这样很显然是不对的,没有模块化的思想,下面的例子介绍Angular的模块化!
<!DOCTYPE HTML><html ng-app="myApp"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>AngularJs模块化</title><script type="text/javascript"src="https://code.angularjs.org/1.3.8/angular.min.js"></head><body><div ng-controller='Aaa'> <p>{{name}}</p></div><div ng-controller='Bbb'> <p>{{name}}</p></div><script type="text/javascript">var m1 = angular.module('myApp',[]);//参数1:模块的名字,参数2:当前模块中依赖的模块,後面的文章会介绍m1.controller('Aaa',function($scope){ $scope.name = 'hello AngularJs';});m1.controller('Bbb',function($scope){ $scope.name = 'Hi';});</script></body></html>首先在html上绑定初始化的名称,并附上myApp,使用angular.model在JS中定义多个模块,并附上参数。
再使用控制器定义数据,注意控制器传递的参数,模块名和匿名函数。
都知道我们的项目在上线後合并压缩的,这样我们匿名函数传递的形参在压缩後出现问题,所以这个时候我们需要将参数包裹成数组,来避免压缩的问题!
m1.controller('Aaa',['$scope',function($scope){ $scope.name = 'hello AngularJs';}]);m1.controller('Bbb',['$scope',function($scope){ $scope.name = 'Hi';}]);这个时候注意控制器传递的参数,模块名和数组(包含服务和匿名函数)。
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
真正的模块化前端模块化很早就开始了,无论是require.js,browserify进行模块化打包,还是Angular进行依赖注入,我们都可以把JS代码分成一个
Angular非常模块化,模块化的一个非常有用的特性就是模块作为延迟加载点。延迟加载意味着可以在后台加载一个模块和其包含的所有组件等资源。这样Angular就不
在前端模块化的时候,不仅仅是js需要进行模块化管理,html有时候也需要模块化管理。这里就介绍下如何通过requirejs,实现html代码的模块化开发。如何使
学习要点:控制器模块化指令模块化过滤器模块化服务模块化定义值模块化使用模块工作第一步:创建一个模块//function:definemodulenamedexa
前端性能 1.模块化 严格来说,代码模块化并不能带来性能上的提升,但还是将模块化提出来,因为它真的很重要,重要到几乎所有的优化都与它息息相关. 常见的模块