标签:
Install:
npm i -g angular-cli
Create a project:
ng new hello-angular2
Run the project:
cd hello-angular2
ng serve
Change the port:
ng serve --port 4201 --live-reload-port 49153
Create a component:
ng g component contact-list-component
The component will be created in src/app/contact-list-component.
// app.component.ts import { Component } from ‘@angular/core‘; import {ContactListComponentComponent} from "./contact-list-component/contact-list-component.component"; @Component({ moduleId: module.id, selector: ‘app-root‘, templateUrl: ‘app.component.html‘, styleUrls: [‘app.component.css‘], directives: [ContactListComponentComponent] }) export class AppComponent { title = ‘app works!‘; }
Generate a child component:
The child component should live inside parent component, for example, we create a contact-detail-component:
cd ./contact-list-component
ng g component ./contact-detail-component
//contact-iist-component.ts import { Component, OnInit } from ‘@angular/core‘; import {ContactDetailComponentComponent} from "./contact-detail-component/contact-detail-component.component"; @Component({ moduleId: module.id, directives: [ContactDetailComponentComponent], selector: ‘app-contact-list-component‘, templateUrl: ‘contact-list-component.component.html‘, styleUrls: [‘contact-list-component.component.css‘] }) export class ContactListComponentComponent implements OnInit { constructor() {} ngOnInit() { } }
If everything went well, you should see:
[Angular 2] Create Angular 2 Porject with Angular CLI
标签:
原文地址:http://www.cnblogs.com/Answer1215/p/5686865.html