angular 6使用总结 | 易学教程

一，安装angular6

D:\cmf\angular6>npm install -g @angular/cli
C:\Users\Administrator\AppData\Roaming\npm\ng -> C:\Users\Administrator\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\@angular\cli\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","a
rch":"x64"})

+ @angular/cli@6.1.3
added 243 packages in 91.487s

二.创建项目

ng new 项目名称

D:\cmf\angular6>ng new project1

cd project1 进入项目目录

ng serve --open 启动本地服务器调试

常用命令

新建组件

ng generate component nav

ng g componment nav

在根组件里引入其他组件（在根组件下引用nav footer组件）

ng g component footer

在footer.component.ts 里的 Component 选项下

selector: 'app-footer',

在根组件下使用

<app-footer></app-footer>

安装ng-bootstrap 安装说明文档 API

https://www.npmjs.com/package/@ng-bootstrap/ng-bootstrap 搜索安装包

D:\cmf\angular6\project1>npm install --save @ng-bootstrap/ng-bootstrap
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","a
rch":"x64"})

+ @ng-bootstrap/ng-bootstrap@2.2.2
added 1 package in 49.419s

然后后根模块 project1\src\app\app.module.ts 里导入

import { NgbModule} from "@ng-bootstrap/ng-bootstrap";

@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
NgbModule
],
providers: [],
bootstrap: [AppComponent]
})