Angular创建项目

Angular创建项目

1. ng new name
2. cd name
3. ng serve --open
4. 使用 Angular CLI 创建一个名为 student 的新组件。

使用下面的命令来创建组件
1. ng generate component students 
2. ng generate component <name> [options] 或者 ng g component <name> [options]
ng g component user-student --module=app 

在给定或默认项目中创建新的通用组件定义。
5. 之后创建了一个新的文件夹 src/app/students/，并生成了 StudentsComponent 的四个文件。app/students/students.component.ts

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

@Component({//@Component 是个装饰器函数，用于为该组件指定 Angular 所需的元数据。
  //CLI 自动生成的三个元数据属性：
  selector: 'app-students',  //selector— 组件的选择器（CSS 元素选择器）
  templateUrl: './students.component.html',//templateUrl— 组件模板文件的位置。
  styleUrls: ['./students.component.css']//styleUrls— 组件私有 CSS 样式表文件的位置。
})
export class StudentsComponent implements OnInit {

  constructor() { }
  ngOnInit() {
  }
} 

6. 在表单元素 <input> 和组件的 student.name 属性之间建立双向数据绑定。

7. *ngFor="let student of students"*ngFor 是一个 Angular 的复写器（repeater）指令。 它会为列表中的每项数据复写它的宿主元素。
   这个例子中涉及的语法如下：

8. 就是 *ngFor 的宿主元素。 students 就是来自 StudentsComponent 类的列表。 当依次遍历这个列表时，student 会为每个迭代保存当前的英雄对象。

新建application

ng generate application <name> [options]
ng g application <name> [options]

在工作区的 “projects” 子文件夹中生成新的基本应用定义。