• angular2学习--根模块


    最近有时间,学习一下angular2,根据自己的理解添加一些自己的理解,有什么不对的地方请指教,

    学习的地址是https://angular.cn/

    下边是分享一下我学习过程

    angular2和angular1一样,都需要创建跟模块

    angular1一般默认用app文件作为根模块的创建文件,创建方式如下

    angular.module('app', [
        'ui.router'
      ])
    

    中括号内部位自己引用的第三方的一些插件或者服务。

    angular2也同样需要创建根模块,创建方式发生了一点变化,创建方式如下

    import { NgModule }      from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    
    import { AppComponent }  from './app.component';
    
    @NgModule({
      imports:      [ BrowserModule ],
      declarations: [ AppComponent ],
      bootstrap:    [ AppComponent ]
    })

    前三行import部分是ts的语法,引入三方的类库,angular的类不再是同一引用,使用哪一部分,需要单独的引用该部分

    和angular1不同,angular1的根模块必须有且有一个,但是angular2必须有一个或多个,是可以有多个的,angular2可以添加特性模块,

    angular2的模块都是带有@NgModule修饰器的类

    @NgModule是一个修饰器函数,接收五个参数

    declarations:这个模块引用的视图类,分为三种组件/指令/管道

    exports:declarations的子模块,可用于其它模块的组件模板

    imports:这个是描述你的模块所引用其他类所在的模块

    providers: 服务的创建者,加入到全局服务列表中,可用于应用任何部分。

    bootstrap: 指定应用的称为根组件,它是所有其它视图的宿主。只有根模块才能设置bootstrap属性。

    angular1的根模块是只需要直接引用js,angular会直接自动的启用,

    angular2是需要我们自己配置启动的,启动一般都是放置在项目的main.ts文件中,启动方式如下

    import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
    import { AppModule } from './app.module';
    
    platformBrowserDynamic().bootstrapModule(AppModule);
  • 相关阅读:
    封装 lhgDialog弹出窗口组件 为C#的api
    最简单的dbhelper类
    asp.net无组件导出Excel
    js中的escape的用法汇总
    【Demo 0110】获取内存信息
    【Demo 0119】延时加载DLL 编程
    【Demo 0112】共享数据段
    【Demo 0116】堆的使用
    【Demo 0111】获取进程当前内存使用
    【Demo 0118】动态加载DLL
  • 原文地址:https://www.cnblogs.com/happen-/p/6258876.html
Copyright © 2020-2023  润新知