import { Component, Input } from '@angular/core';
import { Hero } from './hero';
@Component({
 selector: 'my-hero-detail',
 template: `
 
  
{{hero.name}} details!
  
id: {{hero.id}}
  

  name: 
  
  
 

@Component({
 selector: 'my-hero-detail',
 template: `
 
  
{{hero.name}} details!
  
id: {{hero.id}}
  

  name: 
  
  
 

指令

指令和模板的關(guān)系密切，指令可以與DOM進(jìn)行靈活交互，可以改變樣式也可以修改DOM。一般的指令都作用在已有的DOM元素上

1、修改DOM

編輯

當(dāng)canEdit為true時，button會顯示，否則，button隱藏

2、改變元素樣式

編輯

setStyles()是一個函數(shù)，可以通過這個函數(shù)修改元素的樣式

服務(wù)

服務(wù)是封裝單一功能的單元，常被引用于組件內(nèi)部，作為組件的功能擴(kuò)展。它可以是一個簡單的字符串或是JSON數(shù)據(jù)，也可以是一個函數(shù)甚至是一個類

組件本身不從服務(wù)器獲得數(shù)據(jù)、不進(jìn)行驗證輸入，也不直接往控制臺寫日志。 它們把這些任務(wù)委托給服務(wù)。

一個簡單的服務(wù)（包含一個類）：

export class Hero {
 id: number;
 name: string;
}

依賴注入

通過依賴注入機(jī)制，服務(wù)等模塊可以被引入到任何一個組件中，而開發(fā)者無需關(guān)心這些模塊是如何被初始化的。因為Angular已經(jīng)幫你處理好了，包括本模塊本身依賴的其他模塊也會被初始化

路由

路由它把瀏覽器中的URL看做一個操作指南， 據(jù)此導(dǎo)航到一個由客戶端生成的視圖，并可以把參數(shù)傳給支撐視圖的相應(yīng)組件，幫它決定具體該展現(xiàn)哪些內(nèi)容。 我們可以為頁面中的鏈接綁定一個路由，這樣，當(dāng)用戶點擊鏈接時，就會導(dǎo)航到應(yīng)用中相應(yīng)的視圖。 當(dāng)用戶點擊按鈕、從下拉框中選取，或響應(yīng)來自任何地方的事件時，我們也可以在代碼控制下進(jìn)行導(dǎo)航。 路由器還在瀏覽器的歷史日志中記錄下這些活動，這樣瀏覽器的前進(jìn)和后退按鈕也能照常工作。

感謝各位的閱讀！關(guān)于“Angular2架構(gòu)的示例分析”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站www.cdcxhl.com，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。