?app.component.html

<div style="text-align:center"><h1>welcome to {{title}}</h1><div style="color:#f00000">我是歌謠</div><div>{{name}}</div> </div>

?app.component.ts

import { Component } from '@angular/core';@Component({selector: 'app-root',templateUrl: './app.component.html',styleUrls: ['./app.component.css'] }) export class AppComponent {title = 'ngangular';name = 'zhansan';age = 16;names = ['zhan', 'san', 'li'];constructor() {this.title="歌謠";} }

?app.routing,modules.ts?

import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router';const routes: Routes = [];@NgModule({imports: [RouterModule.forRoot(routes)],exports: [RouterModule] }) export class AppRoutingModule { }

運行結果

?

總結

以上是生活随笔為你收集整理的前端学习（2325）：angular之添加新组件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。