Angular快速入门 模块(一)

文件模块

模块有两层含义,一种是框架代码以模块形式组织称为文件模块,另一种是功能单元以模块形式组织称为应用模块。

文件模块其实就是Typescript提供的语言层面的模块,Angular2代码有多个一级模块构成。

核心模块:包含变换检测,依赖注入,渲染等核心功能代码。

通用模块:包含一些常用的内置指令等。

表单模块:表单相关的组件和指令等。

网络模块:包含处理网络请求相关的服务。


文件模块的使用

文件模块的使用只需要直接导入即可,如上图。


应用模块

文件模块关注的是代码层面的,应用模块关注的功能层面。一个大型的应用由大量的组件,指令以及服务等构成的。这些构建有的没有交集,有的需要协同工作来完成某个特定的功能。我们希望把这些有关联的构件包装到一块,形成一个比较独立的单元。这样的单元在实际应用中就成为应用模块。所以,应用模块,就是对应用类零散的组件,指令,服务等按功能进行归类包装。

应用模块还有一个比较重要的实际意义,因为在默认情况下,一个组件是不能直接引用其它组件,也不能直接使用其它组件的功能,要想使用,就必须先导入。

前面讲父子组件的时候已经提到过,这个导入的过程就是应用模块所实现的。一个组件可以任意使用同模块的其它指令和组件等,但跨模块的组件指令不能直接相互使用。如需实现跨模块的访问,则需要结合模块的导入导出功能。


应用模块的示例

声明模块使用的是@NgModule装饰器。来看一下里面的元数据,

declarations,用来引入组件和指令等进行包装。

Providers属性,是依赖注入的属性,可以看出依赖注入除了能够用在组件里,也可以作用在模块上,二者的使用方法大致相同,区别在于作用域。作用在模块里的服务可以在应用全局里使用。而注入到组件里的,只能在该组件以及子组件里使用。

imports,导入其它模块的,导入之后就能继承其它模块暴露出来的一些组件和指令等。

bootstrap,指定整个Angular2应用的组件树的一个根组件,这个属性只在根模块中使用。

exports,用来设置该模块对外暴露的指令和组件等。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,900评论 25 709
  • 每天清晨,感受着透过雾霾的阳光,我会给自己找个安静的时间,读读学生写的文章,在纸上偷偷和你们约会,因为没有那么多时...
    爱君如初阅读 2,915评论 0 2
  • 佳人之于怀, 非沉鱼落雁,闭月羞花, 恰霁之金梅,芳菲四溢。 鬓挽乌云,眉弯新月, 明眸善睐,靥衬朝霞, 丹唇外朗...
    Xuleei阅读 1,846评论 0 0
  • 清明节快到,大春就惦记着要去看公公。因为公公生前待她最好。 无奈女儿放假第一天下暴雨,事情搁置。第...
    安星瘦阅读 3,012评论 0 0