[Angularjs] نانوغرام كرر: تصفية حسب حقل واحد


Answers

حدد الخاصية (أي colour ) حيث تريد تطبيق الفلتر:

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

لدي مجموعة من المنتجات التي أكررها باستخدام ng-repeat وأنا أستخدم

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

لتصفية هذه المنتجات حسب اللون. يعمل الفلتر ولكن إذا كان اسم / وصف المنتج يحتوي على اللون ، فسيظل المنتج بعد تطبيق الفلتر.

كيف أقوم بضبط الفلتر ليتم تطبيقه فقط على حقل لون المصفوفة الخاصة بي بدلاً من كل حقل؟




يجب استخدام filter:{color_name:by_colour} بدلاً من

filter:by_colour

إذا كنت تريد التطابق مع خاصية واحدة لكائن ، فاكتب تلك الخاصية بدلاً من الكائن ، وإلا فستتطابق بعض الخصائص الأخرى.




كن حذرا مع مرشح الزاوي. إذا كنت تريد تحديد قيمة محددة في الحقل ، فلا يمكنك استخدام الفلتر.

مثال:

جافا سكريبت

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
وهذا يعني أنك تريد تحديد منتج حيث يحتوي "اللون" على سلسلة "أزرق" وليس حيث "اللون" هو "أزرق".




إذا كنت تريد تصفية على grandchild (أو أعمق) من الكائن المحدد ، يمكنك متابعة إنشاء تسلسل هرمي الكائن الخاص بك. على سبيل المثال ، إذا كنت تريد التصفية على "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 } }">



إذا كنت ستفعل ما يلي:

<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>

... لن تحصل فقط على عناصر itemTypeId 2 و itemStatus 1 ، ولكنك ستحصل أيضًا على عناصر itemType 20 و 22 و 202 و 123 و itemStatus 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>