以前都知道angular2有管道這個東西,不過,由於沒有使用的必要,也就沒怎麼看。
今天,做頁面,接收點選查詢傳來的資料,然後,顯示出來。
我的做法是在本地新建乙個object物件result。然後,在資料傳過來的時候,賦值到result。
可問題出在,初始化顯示模板時,我使用了
}
的資料繫結方式,但是,這種方式在 component 初始化的時候,報錯了。
說 result.property 屬性找不到。其實,想一想也明白,初始化html的時候,
result是undefined,所以找不到。
我想了其中一種方法,就是在 result 初始化的時候,用這種形式
result =
但是,屬性差不多有40多個,我豈不是得寫40多次!肯定不行。
後來,想到了angular2有管道這個東西,然後,看了下文件,覺得能用管道解決我這問題。
寫個管道判斷就行了!
import from '@angular/core';@pipe()
export class judgepropertypipe implements pipetransform
else
}}
管道含義,傳入乙個obj: object型別,傳入乙個pro: string型別,
如果obj為空,就返回 'null',
如果obj不為空,那麼就將屬性值返回。
最後,將 juedgepropertypipe 匯入到 module,
然後,module中的所有元件就都能使用了。
}
Angular8管道使用 Pipe
每個應用開始的時候差不多都是一些簡單任務 獲取資料 轉換它們,然後把它們顯示給使用者。獲取資料可能簡單到建立乙個區域性變數就行,也可能複雜到從 websocket 中獲取資料流。一旦取到資料,你就可以把它們原始值的 tostring 結果直接推入檢視中。但這種做法很少能具備良好的使用者體驗。比如,幾...
Angular2的管道Pipe的使用方法
管道pipe可以將資料作為輸入,然後按照規則將其轉換並輸出。在angular2中有許多內建的pipe,比如datepipe uppercasepipe和currencypipe等。在這裡我們主要介紹如何自定義pipe。1.管道定義 pipe的定義如下 所示 import from angular c...
如何自定義Angular2 管道
1.說明 管道用來轉換模板顯示的內容,應用程式中經常出現獲取資料,轉換資料,顯示資料的邏輯。管道就是用來在轉換資料階段起作用的。主要存在兩種型別的管道,pure pipe和impure pipe 2.pure pipe pure pipe,stateless,關注於純粹物件的變更,檢測到輸入值發生了...