參考資料:
我現在用的angular 版本是8,發現該方法可用;效果圖:
首先建立乙個pipe,
import from '@angular/core';ps: 普及一下pipe知識點:import from '@angular/platform-browser'; //
資料在頁面上繫結可以安全解析
@pipe()
export class keylightpipe implements pipetransform
transform(val: string, keyword: string): any `); // 將匹配到的關鍵字替換
//console.log(res);
return
this
.sanitizer.bypasssecuritytrusthtml(res);}}}
import from '@angular/core';@pipe()
export class repeatpipe implements pipetransform }//
例項:在模板中呼叫 } 的結果是 okokok。即冒號 「:」 後面跟第二個引數
// html<
tr *ngfor
="let data of ajaxtable.data"
>
<
td>
<
span
[innerhtml]
="data.artifactid | keylight: pagedata.filter"
>
span
> // 這裡pagedate.filter 是 介面返回給的關鍵字,如果介面沒有返回,可以自行宣告建立或溝通後端給乙個~~~233333
td>
tr>
關鍵字的高亮搜尋
今天在開發中遇到乙個需求,是要求我們把我們搜尋到的那個關鍵字匹配到的字型改變顏色 平常我們不用框架,在傳值的時候用父子相傳這種方式的時候我們可以用以下 hhh text 另一種是我們路由跳轉時進行的傳參,比如 if data 符合資訊時跳轉 接收時 this.route.query.id 後台管理系...
vue 搜尋高亮關鍵字
在一些查詢中,我們希望我們查詢的關鍵字,可以在查詢內容中高亮出來 this.arr response.data this.caselist this.arr.foreach item this.caselist.map item brightkeyword val else arr是我們從後台獲取的...
WPF搜尋關鍵字高亮顯示
目標 在wpf中,對lucene.net進行全文檢索後的結果中包含的關鍵字進行高亮顯示。檢索結果中的關鍵字高亮顯示,在網頁中顯示是很簡單的,lucene中加標籤樣式就可以了,可是在wpf中就不行了。我在wpf中用gridcontrol顯示搜尋結果列表,gridcontrol的模板裡用textbloc...