要求是中文的時候顯示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...