एनजी-रिपीट: सिंगल फील्ड द्वारा फिल्टर

Question

मेरे पास उत्पादों की एक सरणी है जो मैं एनजी-रिपीट का उपयोग करके दोहरा रहा हूं और उपयोग कर रहा हूं

<div ng-repeat="product in products | filter:by_colour"> 

इन उत्पादों को रंग से फ़िल्टर करने के लिए। फ़िल्टर काम कर रहा है, लेकिन यदि उत्पाद के नाम / विवरण आदि में रंग है तो फ़िल्टर लागू होने के बाद उत्पाद रहता है।

मैं फ़िल्टर को केवल हर क्षेत्र के बजाय अपने सरणी के रंग क्षेत्र पर लागू करने के लिए कैसे सेट करूं?

Comments

कस्टम फ़िल्टर भी शक्तिशाली हैं =), आप इसे पसंद कर सकते हैं, उदाहरण: noypi-linux.blogspot.com/2014/07/…

— Noypi Gilas

अलग समाधान: stackoverflow.com/a/24992197/257470

— andrew.fox 10

बढ़िया काम वर्तनी रंग सही तरीके से

— MikeKulls

Answer 1

फ़िल्टर पृष्ठ पर उदाहरण देखें । किसी ऑब्जेक्ट का उपयोग करें, और रंग को रंग गुण में सेट करें:

Search by color: <input type="text" ng-model="search.color">
<div ng-repeat="product in products | filter:search"> 

Comments

धन्यवाद मार्क, क्या नीचे दिए गए तरीके के बजाय इसे इस तरह से करने के कोई लाभ हैं?

— टिम वेबस्टर

@Seglespaan, वास्तव में नहीं। आपको लग सकता है कि bmleite और blesh द्वारा प्रस्तुत विधि अच्छे से पढ़ी गई है, क्योंकि आप देख सकते हैं कि आप रंग द्वारा फ़िल्टर कर रहे हैं। यह विधि अधिक कॉम्पैक्ट है, जो कि उपयोगी हो सकती है यदि आप कई गुणों द्वारा खोज करना चाहते हैं, और आपके पास HTML में एक लंबी वस्तु नहीं होगी: filter:{ color: '...', size: '...', ...}

— मार्क रजक

@ मर्कराजकोक, मैं चौराहे के बजाय संघ को देखते हुए, कई संपत्तियों की खोज कैसे कर सकता हूं?

— जेटकॉम

@jetcom, आपको एक कस्टम फ़िल्टर की आवश्यकता होगी, देखें stackoverflow.com/a/13845135/215945

— मार्क राजकोक

मुझे नहीं पता कि ओपी पूछ रहा था कि सर्च बॉक्स को कैसे बनाया जाए, क्योंकि जब वे पेज पर दोहरा रहे हों तो एनजी-रिपीट में मूल्यों को कैसे फ़िल्टर किया जाए। इस एक के नीचे दिया गया उत्तर, पूछे गए प्रश्न के लिए सबसे अधिक प्रासंगिक लगता है।

— ट्विनकब

Answer 2

उस संपत्ति (यानी colour) को निर्दिष्ट करें जहाँ आप फ़िल्टर लागू करना चाहते हैं:

<div ng-repeat="product in products | filter:{ colour: by_colour }">

Comments

अगर मैं चाहता हूँ! फ़िल्टर के रूप में by_colour: {color:! by_colour} "

— rjdmello

@rjdmello अभी प्रीपेंड करते हैं '!'+, इस तरह<div ng-repeat="product in products | filter:{ colour: '!'+by_colour }">

— bmleite

यकीन नहीं होता अगर मैं इसे सही तरीके से समझ पाया, लेकिन पहली बात जो मेरे दिमाग में आई वह थी: <div ng-repeat="product in products | filter:{ resultsMap.annie: '!!' }"> या (कुछ समतुल्य) इस तरह: <div ng-repeat="product in products | filter:by">और कंट्रोलर पर $scope.by = { 'resultsMap.annie': '!!' };:। यह दूसरा दृष्टिकोण आपको फ़िल्टर की जा रही संपत्ति पर अधिक नियंत्रण देता है। नोट: का '!!'अर्थ है "शून्य नहीं"।

— बमीलेइट

@ फ़ेडरिको, customFilterआपके लिए एक साधारण वस्तु हो सकती है scopeजिसे आप जब भी आवश्यकता होती है अपडेट करते हैं। इस प्लंकर की जाँच करें ।

— बामलेइट

यह स्वीकृत उत्तर होना चाहिए। यह सबसे अधिक रसीला है। खैर, सिवाय इसके कि 'रंग' में बहुत सारे स्वर हैं।

— रैप

Answer 3

आप किसी ऑब्जेक्ट द्वारा उस ऑब्जेक्ट से मेल खाते हुए ऑब्जेक्ट को फ़िल्टर कर सकते हैं, जिस पर आपको फ़िल्टर करना है:

app.controller('FooCtrl', function($scope) {
   $scope.products = [
       { id: 1, name: 'test', color: 'red' },
       { id: 2, name: 'bob', color: 'blue' }
       /*... etc... */
   ];
});

<div ng-repeat="product in products | filter: { color: 'red' }"> 

यह निश्चित रूप से चर द्वारा पारित किया जा सकता है, जैसा कि मार्क राजकोक ने सुझाव दिया था।

Comments

मान लें कि मेरे पास इस तरह की गुंजाइश है। उत्पाद: {आईडी: 1, नाम: 'परीक्षण', रंग: 'लाइटब्लू'}, {आईडी: 2, नाम: 'बॉब', रंग: [{अग्रभूमि: काली, पृष्ठभूमि :सफेद}] }। फिर मैं रंग के आधार पर उत्पाद को कैसे फ़िल्टर कर सकता हूं: सफेद मूल्य प्राप्त करने के लिए पृष्ठभूमि?

— ग्रीरी

@Gery: ईमानदारी से, मुझे नहीं लगता कि आप कर सकते हैं। किसी भी तरह से, फिल्टर का उपयोग करना: सभी तरह के बुरे अभ्यास, आईएमओ। इसमें वह आपके विचार में तर्क देता है जो वास्तव में आपके नियंत्रक में होना चाहिए, और बहुत परीक्षण योग्य नहीं है।

— बेन लेश

यह फ़िल्टरिंग को नियंत्रक में ले जाने और मॉडल का विस्तार करने का एक तरीका है। ozkary.com/2015/05/angularjs-value-mapping-with-dynamic.html ।

— ozkary

Answer 4

यदि आप दिए गए ऑब्जेक्ट के पोते (या गहरे) पर फ़िल्टर करना चाहते हैं, तो आप अपनी ऑब्जेक्ट पदानुक्रम का निर्माण जारी रख सकते हैं। उदाहरण के लिए, यदि आप 'thing.properties.title' पर फ़िल्टर करना चाहते हैं, तो आप निम्न कार्य कर सकते हैं:

<div ng-repeat="thing in things | filter: { properties: { title: title_filter } }">

आप किसी वस्तु के कई गुणों को केवल अपनी फ़िल्टर वस्तु में जोड़कर फ़िल्टर कर सकते हैं:

<div ng-repeat="thing in things | filter: { properties: { title: title_filter, id: id_filter } }">

Comments

यह 'या' प्रकार या 'और' प्रकार का फ़िल्टर है।

— एसएमएस

एक ही सवाल है कि एक और एक या जब एक से अधिक संपत्ति छान रहे हैं?

— खो गया

OR फ़िल्टर के लिए केवल कस्टम फ़िल्टर है, मुझे लगता है

— दिमित्री अल्गाज़िन

Answer 5

ऐसा करने का सबसे अच्छा तरीका एक फ़ंक्शन का उपयोग करना है:

एचटीएमएल

<div ng-repeat="product in products | filter: myFilter">

जावास्क्रिप्ट

$scope.myFilter = function (item) { 
    return item === 'red' || item === 'blue'; 
};

वैकल्पिक रूप से, आप एक निश्चित मानदंड के आधार पर तत्वों को गतिशील रूप से दिखाने और छिपाने के लिए ngHide या ngShow का उपयोग कर सकते हैं।

Answer 6

कोणीय फिल्टर से सावधान रहें। यदि आप फ़ील्ड में विशिष्ट मान का चयन करना चाहते हैं, तो आप फ़िल्टर का उपयोग नहीं कर सकते।

उदाहरण:

जावास्क्रिप्ट

app.controller('FooCtrl', function($scope) {
   $scope.products = [
       { id: 1, name: 'test', color: 'lightblue' },
       { id: 2, name: 'bob', color: 'blue' }
       /*... etc... */
   ];
});

एचटीएमएल

<div ng-repeat="product in products | filter: { color: 'blue' }"> 

यह दोनों का चयन करेगा, क्योंकि कुछ का उपयोग करें substr
इसका मतलब है कि आप ऐसे उत्पाद का चयन करना चाहते हैं जहां "रंग" में स्ट्रिंग "नीला" हो और न कि जहां "रंग" "नीला" हो।

Comments

<div ng-repeat="product in products | filter: { color: 'blue' }:true">केवल सटीक मैचों पर काम करेंगे (अंत में 'सत्य' है तुर्क तर्क: लिंक

— मार्क

Answer 7

रंग द्वारा खोजें:

<input type="text" ng-model="searchinput">
<div ng-repeat="product in products | filter:{color:searchinput}">

आप एक आंतरिक घोंसला भी कर सकते हैं।

filter:{prop1:{innerprop1:searchinput}}

Answer 8

यदि आप निम्न कार्य करने वाले थे:

<li class="active-item" ng-repeat="item in mc.pageData.items | filter: { itemTypeId: 2, itemStatus: 1 } | orderBy : 'listIndex'"
                id="{{item.id}}">
    <span class="item-title">{{preference.itemTitle}}</span>
</li>

... आपको केवल आइटम टाइप 2 और आइटमस्टैटस 1 के आइटम नहीं मिलेंगे, बल्कि आपको आइटमटाइप 20, 22, 202, 123 और आइटमस्टैटस 10, 11, 101, 123 के साथ आइटम भी मिलेंगे। ऐसा इसलिए है क्योंकि फ़िल्टर {... ।} वाक्य रचना एक स्ट्रिंग की तरह क्वेरी होती है।

हालाँकि, यदि आप इसमें शामिल थे : सच्ची स्थिति, तो यह सटीक मिलान करके फ़िल्टर करेगा:

<li class="active-item" ng-repeat="item in mc.pageData.items | filter: { itemTypeId: 2, itemStatus: 1 } : true | orderBy : 'listIndex'"
                id="{{item.id}}">
    <span class="item-title">{{preference.itemTitle}}</span>
</li>

Answer 9

मेरा रास्ता यह है

subjcts is

[{"id":"1","title":"GFATM"},{"id":"2","title":"Court Case"},{"id":"3","title":"Renewal\/Validity"},{"id":"4","title":"Change of Details"},{"id":"5","title":"Student Query"},{"id":"6","title":"Complains"}]

उप एक इनपुट क्षेत्र है या आप जो भी पसंद करते हैं

इस तरह प्रदर्शित करना

<div ng-if="x.id === sub" ng-repeat=" x in subjcts">{{x.title}}</div>

Comments

सामान्य तौर पर एनजी-

— इफ

Answer 10

आपको filter:{color_name:by_colour}इसके बजाय उपयोग करना चाहिए

filter:by_colour

यदि आप किसी ऑब्जेक्ट की एकल प्रॉपर्टी के साथ मैच करना चाहते हैं, तो ऑब्जेक्ट के बजाय उस प्रॉपर्टी को लिखें, अन्यथा कुछ अन्य प्रॉपर्टी को मैच मिल जाएगा।

Answer 11

फ़िल्टर में वह गुण निर्दिष्ट करें, जिस पर आप फ़िल्टर लागू करना चाहते हैं:

//Suppose Object
var users = [{
  "firstname": "XYZ",
  "lastname": "ABC",
  "Address": "HOUSE NO-1, Example Street, Example Town"
},
{
  "firstname": "QWE",
  "lastname": "YUIKJH",
  "Address": "HOUSE NO-11, Example Street1, Example Town1"
}]

लेकिन आप केवल firstname पर फ़िल्टर लागू करना चाहते हैं

<input type = "text" ng-model = "first_name_model"/>
<div ng-repeat="user in users| filter:{ firstname: first_name_model}">

Answer 12

यदि आप एक क्षेत्र के लिए फ़िल्टर चाहते हैं:

label>Any: <input ng-model="search.color"></label> <br>
<tr ng-repeat="friendObj in friends | filter:search:strict">

यदि आप सभी फ़ील्ड के लिए फ़िल्टर चाहते हैं:

 label>Any: <input ng-model="search.$"></label> <br>
 <tr ng-repeat="friendObj in friends | filter:search:strict">

और https://docs.angularjs.org/api/ng/filter/filter आपके लिए अच्छा है