Angular：基础

安装

安装脚手架

 npm install -g @angular/cli

安装完成后输入 ng v，会出现以下内容：

创建项目

//创建项目并安装依赖
ng new 项目名称
//只创建项目
ng new 项目名称 --skip-install

运行

//需要手动打开（复制地址到浏览器）
ng serve
//自动打开
ng serve --open

运行过程中出现了以下错误
The serve command requires to be run in an Angular project, but a project definition could not be found.
应该是依赖安装失败的问题。在项目目录下运行 npm install 或 cnpm install 重新下载依赖，依赖下载完成后再重新运行

运行成功后如下图所示：

文件

app.module.ts

// 这个文件是angular根模块，告诉angular如何组装应用

//angular核心模块
import { NgModule } from '@angular/core';
// 浏览器解析的模块
import { BrowserModule } from '@angular/platform-browser';
//根组件
import { AppComponent } from './app.component';

// 装饰器，接受一个元数据对象，告诉angular如何编译和启动应用
@NgModule({
  declarations: [   //配置当前项目运行的组件
    AppComponent
  ],
  imports: [         //配置当前模块运行依赖的其它模块
    BrowserModule
  ],
  providers: [],          //配置项目所需要的服务
  bootstrap: [AppComponent]       //指定应用的根组件，通过引导AppModule来启动应用
})
//根模块，不需要导出任何东西
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',   //使用这个组件的名称
  templateUrl: './app.component.html',     //html
  styleUrls: ['./app.component.scss']       //css
})
export class AppComponent {
  title = 'Demo1';              //定义属性
  constructor() { }              //构造器
}