angular8 封裝元件

2021-09-26 09:19:07 字數 1417 閱讀 1970

元件封裝的意義和方法

需要重用,或者簡化邏輯

ng generate component元件名  (駝峰模式)

使用index.ts方便匯入以及隔離內部變化對外部的影響

ng g c 元件名(駝峰模式)

如果想在某個資料夾下新建元件   ng g c 檔名/元件名(駝峰模式)

在每乙個資料夾下新建乙個index.ts   引用 

每乙個元件裡 export * from './scrollable-tab.component';

大元件資料夾下   export * from './scrollable-tab'

組的輸入輸出件

父元件 ->  子元件  @input  屬性繫結

子元件 -> 父元件  @output   事件繫結

1.父元件引用子元件  父元件資料傳到子元件

父元件

import  from '@angular/core';

import from './components';

@component()

menus:topmenu = [,,

,,,,

];menus1:topmenu = [,,

,,

];}

子元件 

scrollable-tab.component.html

scrollable.component.ts

import  from '@angular/core';

export inte***ce topmenu

@component()

export class scrollabletabcomponent implements oninit

ngoninit()

}

2.父元件引用子元件  子元件資料傳到父元件

子元件:scrollable.component.html

scrollable.component.ts

import  from '@angular/core';

export inte***ce topmenu

@component()

export class scrollabletabcomponent implements oninit

ngoninit()

handleselection(index : number)

}

父元件:

handeltabselected(a:topmenu)

C 學習(8) 封裝

c 物件導向的三大特性 封裝 繼承 多型 c 認為萬事萬物都可以為物件,物件上有其屬性和行為 具有相同性質的物件,可以抽象為類 封裝是c 物件導向三大特性之一 封裝的意義 封裝意義一 在設計類的時候,屬性和行為寫在一起,表現事物 語法 class 類名 示例1 設計乙個圓類,求圓的周長 includ...

Angular 8 許可權控制

1.沒有許可權內的頁面,自動跳轉到 無法找到頁面 2.沒有許可權的按鈕,控制項不顯示 3.沒有登入token訪問需要登入的頁面,自動跳轉到 無法找到頁面 思路 用乙個service 去儲存登入使用者的許可權列表。在需要許可權控制的按鈕 控制項上通過 ngif 控制控制項可見性。在每個頁面 activ...

angular8的元件的生命週期

constructor 建構函式永遠首先被呼叫 ngonchanges 輸入屬性變化時被呼叫 在元件的 input 屬性發生變化的時候呼叫 ngoninit 元件初始化時被呼叫 ngdocheck 髒值檢測時呼叫 會呼叫多次 ngaftercontentinit 當內容投影ng content完成時...