ऑरेलिया व्यू में फ़िल्टर सरणी

Question

मैं aurelia का उपयोग कर रहा हूं और मॉडल देखने के बजाए एक संग्रह (सरणी) को फ़िल्टर करना चाहता हूं।

मैं ऐसा करने के लिए निम्न सिंटैक्स कोशिश कर रहा हूँ:

<div class="col-sm-7 col-md-7 col-lg-7 ${errors.filter(function(err){return err.Key==='car.Model';}).length >0? 'alert alert-danger' :''}"> 
      <span repeat.for="error of errors"> 
       <span if.bind="error.Key==='car.Model'"> 
        ${error.Message} 
       </span> 
      </span> 
</div> 

और मैं ब्राउज़र कंसोल में निम्न त्रुटि हो रही है:

Error: Parser Error: Missing expected) at column 28 in [errors.filter(function(err){return err.Key==='car.Model';]।

इस प्रकार यह AngularJS में संभव है:

<div class="small-7 medium-7 large-7 columns end"> 
     <span class="error" ng-repeat="error in errors | filter:{ Key: 'car.Model'}"> 
      <span class="error-message"> 
       {{error.Message}} 
      </span> 
     </span> 
    </div> 

समान बात भी Aurelia में संभव है?

मुझे यह भी जानना अच्छा लगेगा कि ऑरेलिया में repeat.for में संग्रह/सरणी कैसे फ़िल्टर की जा सकती है (ng-repeat के समान)। मैंने समान रूप से फ़िल्टर फ़ंक्शन का उपयोग करने की कोशिश की लेकिन यह भी काम नहीं किया और मुझे भी इसी तरह की त्रुटि मिली।

Answer 1

यह थोड़ा शर्मनाक है। लेकिन थोड़ी सी शोध के बाद (जो मुझे पहले से किया जाना चाहिए था: पी) मुझे जवाब मिल गया है।

यह वैल्यू कनवर्टर का उपयोग करके किया जा सकता है जैसा कि यहां दिखाया गया है: http://jdanyow.github.io/aurelia-converters-sample/।

और मुझे लगता है कि यह काफी अच्छा है।

अब मेरी कोड इस तरह दिखता है:

<div class="col-sm-7 col-md-7 col-lg-7 alert alert-danger" if.bind="errors | hasPropertyValue:'Key':'car.Model'"> 
    <span repeat.for="error of errors | filterOnProperty:'Key':'car.Model'"> 
     <span> 
      ${error.Message} 
     </span> 
    </span> 
</div> 

और मैं टाइपप्रति में valueconverters की जोड़ी को परिभाषित किया है (valueconverters.ts):

export class FilterOnPropertyValueConverter { 
toView(array: {}[], property: string, exp: string) { 

    if (array === undefined || array === null || property === undefined || exp === undefined) { 
     return array; 
    } 
    return array.filter((item) => item[property].toLowerCase().indexOf(exp.toLowerCase()) > -1); 
} 
} 

export class HasPropertyValueValueConverter { 
toView(array: {}[], property: string, exp: string) { 

    if (array === undefined || array === null || property === undefined || exp === undefined) { 
     return false; 
    } 
    return array.filter((item) => item[property].toLowerCase().indexOf(exp.toLowerCase()) > -1).length > 0; 
} 
} 

और मैं अंत में मेरे विचार में इन आयातित: <import from="yourPath/valueconverters"></import>

Answer 2

इसी तरह से ऑरेलिया का उपयोग करने के तरीके सीखने के लिए अच्छा है। फ़िल्टर किए गए सूची की गणना निम्न कोणीय 1 कोड की तरह कैसे प्राप्त करें?

<div class="small-7 medium-7 large-7 columns end"> 
     <span class="error" ng-repeat="error in filtered = (errors | filter:{ Key: > 'car.Model'})"> 
      <span class="error-message"> 
       {{error.Message}} 
      </span> 
     </span> 
    </div> 
      <div class="row text-center" ng-if="errors.length>0"> 
       Total records: {{filtered.length}} 
      </div>