【angular】NgModule学习

NgModule参考手册

在模板中可用的选择器 selector 包括那些直接声明在这里的可声明对象和导入的那些 NgModule 中所导出的可声明对象。

可声明对象必须属于也 只能属于一个模块 。 如果你尝试把同一个类声明在多个模块中，那么编译器就会报错。 要注意 不能声明那些从其它模块中导入的类 。

Angular 使用 entryComponents 来启用 树震动 ， 即 只编译 项目中 实际使用 的组件 ，而不是编译所有在 ngModule 中声明但从未使用的组件

这是用 ViewContainerRef.createComponent( ) 添加的动态添加的组件。将它们添加到 entryComponents 告诉脱机模板编译器编译它们并为它们创建工厂。

Angular 会自动将以下类型的组件添加到模块的 entryComponents 中：

① @ NgModule.bootstrap 列表中的组件，如动态加载 AppComponent 。

② 路由器配置中引用的组件，因为 router-outlet 也使用 ViewContainerRef.createComponent( ) 将路由组件添加到 DOM 。。

离线模板编译器 OTC 只生成实际使用的组件。如果组件不直接用于模板， OTC 不知道是否需要编译。有了 entryComponents ，你可以告诉 OTC 也编译这些组件，以便在运行时可用。如一个列表页中点击新增按钮时，d出的表单组件，它不在路由中，需要显示写在 entryComponents 中 。

导出具有传递性。 ModuleA 可以导入 ModuleB 并将其导出，这会让所有 ModuleB 中的导出同样可用在导入了 ModuleA 的那些模块中。

angular 中的 NgModule 是否类似 java 中的 package 呢？

通过导出的传递性，将第三方组件模块引入到具体的页面模块

Angular 系统中通过在类上添加 @Injectable 装饰器来告诉系统这个类(服务)是可注入的。当然了这仅仅只是告诉 Angular 系统这个类(服务)类是可注入的。但是这个服务可以在哪里使用，由谁提供，就得靠注入器和提供商来一起确定了。

（一） providedIn 方式：对应三个值: Type<any>、 root 、 null

编译的时候会抛出一个警告信息，编译不过。具体怎么写，也请看原文吧。

（二） Component (组件)级注入器

本人自己看的 angular工程案例 中，使用 第二种方式 的居多（即装饰器 @Component 中的 providers 比较常见； @NgModule中 的 providers 就在 app.module 中见过 ）；

关于 provider的详细介绍 也请参看原文，本人还未深入学习，后期有机会深入使用的话，再认真看看。暂时先会简单的使用！！！

@NgModule 了解一点喽，后面再看看其他装饰器： Angular装饰器介绍

能具体说一下你的需求吗？

创建自定义指令的方法：

<!--创建自定义指令-->

<div id="appauto" data-ng-app="appauto">

    <!--标签-->

    <app-auto></app-auto>

    <!--属性-->

    <div app-auto></div>

    <!--类名-->

    <div class="app-auto"></div>

    <!--注释-->

    <!-- directive：app-auto -->

</div> var appauto=angular.module('appauto',[])

        appauto.directive('appAuto',function(){

            return {

//                restrict限制使用：

//                A属性E元素C类名M注释，默认EA

                restrict:'AEMC',

                template:'<h1>自定义指令创建</h1>'

            }

        })

        angular.bootstrap(document.getElementById('appauto'),['appauto'])

---