angular元件使用

1.定義子元件

@component()

export 
class
productdetail

新增裝飾器說明是乙個元件，selector指明了該元件使用的標籤名，templeteurl指定元件模板即html，styleurls指定樣式模板。

父元件使用該子元件

//父元件html

2.父元件向子元件傳值
（1）子元件新增@input，表示向子元件輸入
export class
productdetail

（2）父元件使用

product

3.子元件向父元件推送事件

(1)子元件新增output，表示子元件向外推送事件

export class

productdetail

(2) product-detail.html內觸發事件 

"

notify.emit()
" >notify me　　//子元件觸發事件

(3) 父元件接收事件

product

" (notify)="

事件方法

可以通過事件觸發向父元件傳遞值。

angular2 0使用元件樣式

實現方式之一，是在元件的元資料中設定styles屬性。styles屬性可以接受乙個包含 css 的字串陣列。通常我們只給它乙個字串就行了，如同下例 copy code component export class 元件樣式在很多方面都不同於傳統的全域性性樣式。這種模組化相對於 css 的傳統工作方式...

Angular元件封裝

前言 在專案中我們常看到乙個頁面裡的 在很多頁面裡面用到，我們會把它封裝成乙個元件供多個頁面引用我們在頁面看到類似於下圖的標籤，就是引用的封裝好的元件 changepage event editbutton btnedit addopen addopen event,addmodal editdat...

Angular元件 投影

執行時動態改變元件模版的內容。沒路由那麼複雜，只是一段html，沒有業務邏輯。ngcontent指令將父元件模版上的任意片段投影到子元件上。1 子元件中使用指令來標記投影點 div class h2 我是子元件 h2 div 這個div定義在子元件中 div ng content ng conten...