मैंने इस पाइप को कोणीय 2 में किया है जो कुछ मानदंडों के अनुसार एक सरणी को फ़िल्टर करता है:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'filter',
pure: false
})
export class FilterPipe implements PipeTransform {
transform(value: any, args?: any): any {
if(value.length === null){
return value;
}
let resultArray = [];
for(let item of value)
{
if(item.match('^.*'+args[0]+'.*$'))
{
resultArray.push(item);
}
}
return resultArray;
}
}
और यहां HTML पृष्ठ है जहां मैं फ़िल्टर का उपयोग केवल अक्षर ई से शुरू होने वाले मानों को प्रदर्शित करने के लिए करता हूं:
<input type="text" [(ngModel)]="val">
<hr>
<button type="button" class="btn btn-primary" (click)="onClick(val)">Add Item</button>
<hr>
<h1>
<li *ngFor="let item of values | filter: 'e'">{{item}}</li>
</h1>
ऑनक्लिक () विधि को निम्नलिखित स्क्रिप्ट द्वारा दर्शाया गया है:
export class AppComponent {
title = 'app works!';
values=['east', 'middle east'];
onClick(val)
{
// if(val==null)
// {
// return null;
// }
// val=this.values.indexOf(values)
this.values.push(val);
//this.values.push(val);
//console.log(val)
}
मैं यह देखने के लिए फ़िल्टर में एक शर्त जोड़ना चाहता हूं कि सरणी में कोई मौजूदा मान है या नहीं, भले ही वह अक्षर ई से शुरू हो, इसे सरणी में जोड़ने के लिए नहीं।
मैंने ऑनक्लिक () विधि में निम्नलिखित की कोशिश की, लेकिन यह काम नहीं किया और कोई त्रुटि प्रदर्शित नहीं हुई:
onClick(val)
{
if(val==null)
{
return null;
}
else{
if(val==this.values.indexOf(this.values))
{
return null;
}
else
{
this.values.push(val);
}
}
तो मैंने पाइप में निम्नलिखित जोड़ा:
if(item.match(args[0]))
{
return null;
}
और फिर भी बिना किसी त्रुटि के काम नहीं किया।
1 उत्तर
अपने पाइप में आप अपने सरणी में अद्वितीय तत्वों को फ़िल्टर कर सकते हैं और डुप्लिकेट निकाल सकते हैं:
let uniqueArray = value.filter(function (el, index, array) {
return array.indexOf (el) == index;
});
फिर आप इन तत्वों को पकड़ सकते हैं जो आपकी विशिष्ट स्ट्रिंग से शुरू होते हैं:
for (let item of uniqueArray) {
if (item.match("^"+args[0])) {
resultArray.push(item);
}
}
मैंने एक कार्यशील उदाहरण बनाया: https://plnkr.co/edit/zqhFlTmp5YxABf4LVNUV?p=preview< /ए>
आप अपना वास्तविक डेटा और फ़िल्टर किया गया डेटा देख सकते हैं।
संबंधित सवाल
नए सवाल
angular
Google से वेब फ्रेमवर्क के बारे में प्रश्न इस टैग का उपयोग कोणीय प्रश्नों के लिए करें जो एक व्यक्तिगत संस्करण के लिए विशिष्ट नहीं हैं। पुराने AngularJS (1.x) वेब ढांचे के लिए, कोणीयज टैग का उपयोग करें।
onClick(val) { if( this.values.indexOf(val) === -1) { this.values.push(val); } }