angular2自定義管道省略字元

2021-09-24 11:50:43 字數 889 閱讀 3903

要求是中文的時候顯示10個字元,英文的時候顯示20個字元,不知道怎麼具體實現,就想到了管道

下面是實現方法 

1.自定義實現乙個管道功能,繼承了方法,還處在看api的狀態,具體怎麼實現的還沒弄清楚

2.transform引數的方法

首先宣告管道,繼承方法transform,如圖所示,除了第乙個是傳過來的具體引數,其餘都是自己隨意定的引數。

import  from '@angular/core';

@pipe()

export class fitercodelengthpipe implements pipetransform

}

3.具體功能實現省略字元

首先根據中英文轉換獲取字元具體的長度,然後根據長度來擷取字元

import  from '@angular/core';

@pipe()

export class fitercodelengthpipe implements pipetransform else

rstr += value.charat(i);

}return rstr + (tail || ' …');

}getchars(str)

var len = str.length;

for (var i = 0; i < len; i++) else

}return length;}}

4.頁面具體實現方法

// 傳參的形式,用:隔開

}

如何自定義Angular2 管道

1.說明 管道用來轉換模板顯示的內容,應用程式中經常出現獲取資料,轉換資料,顯示資料的邏輯。管道就是用來在轉換資料階段起作用的。主要存在兩種型別的管道,pure pipe和impure pipe 2.pure pipe pure pipe,stateless,關注於純粹物件的變更,檢測到輸入值發生了...

Angular4中自定義管道

angular 是由谷歌開發與維護乙個開發跨平台應用程式的框架,同時適用於手機與桌面。管道的作用是把資料作為輸入,然後轉換它,給出期望的輸出。7.1 使用管道 如 import from angular core component export class herobirthdaycomponen...

angular 自定義指令

模板 var mymodule angular.module mymodule mymodule.directive directivename function return restrict string,template string,templateurl string,priority n...