Ibland kan de inbyggda filtren i Angular inte uppfylla behoven eller kraven för filtreringsoutput. I ett sådant fall kan ett anpassat filter skapas som kan skicka utmatningen på önskat sätt.
Hur man skapar anpassat filter
I exemplet nedan ska vi skicka en sträng till vyn från styrenheten via scope-objektet, men vi vill inte att strängen ska visas som den är.
Vi vill se till att när vi visar strängen skickar vi ett anpassat filter som lägger till en annan sträng och visar den färdiga strängen för användaren.
Event Registration Guru99 Global Event
This tutorial is {{tutorial | Demofilter}}
Kodförklaring:
- Här skickar vi en sträng "Angular" i en medlemsvariabel som kallas tutorial och fäster den till scope-objektet.
- Angular tillhandahåller filtertjänsten som kan användas för att skapa vårt anpassade filter. 'Demofilter' är ett namn som ges till vårt filter.
- Detta är det vanliga sättet på vilket ett anpassat filter definieras där en funktion returneras. Den här funktionen är vad som innehåller den anpassade koden för att skapa det anpassade filtret. I vår funktion tar vi en sträng "Angular" som skickas från vår syn till filtret och lägger till strängen "Tutorial" till detta.
- Vi använder vår Demofilter på vår medlemsvariabel som skickades från styrenheten till vyn.
Om koden körs framgångsrikt visas följande utdata när du kör din kod i webbläsaren.
Produktion:
Från produktionen,
- Det kan ses att vårt anpassade filter har tillämpats och
- Ordet 'Tutorial' har lagts till i slutet av strängen, som skickades i medlemsvariabelhandledning.
Sammanfattning:
Om det finns ett krav som inte uppfylls av något av de filter som definieras i vinkel, kan du skapa ditt anpassade filter och lägga till din anpassade kod för att bestämma vilken typ av utdata du vill ha från filtret. A