আমি একাধিক যুক্তি সহ একটি Angular.js ফিল্টারকে কীভাবে কল করব?


297

ডকুমেন্টেশন হিসাবে , আমরা একটি ফিল্টার কল করতে পারি যেমন তারিখের মতো:

{{ myDateInScope | date: 'yyyy-MM-dd' }}

এখানে তারিখটি এমন একটি ফিল্টার যা একটি যুক্তি নেয়।

টেমপ্লেট এবং জাভাস্ক্রিপ্ট কোড থেকে উভয়ই বেশি পরামিতি সহ ফিল্টারগুলিকে কল করার সিনট্যাক্সটি কী?

উত্তর:


621

টেম্পলেটগুলিতে, আপনি কলোন দ্বারা ফিল্টার আর্গুমেন্টগুলি পৃথক করতে পারেন ।

{{ yourExpression | yourFilter: arg1:arg2:... }}

জাভাস্ক্রিপ্ট থেকে, আপনি এটি হিসাবে কল

$filter('yourFilter')(yourExpression, arg1, arg2, ...)

অর্ডার বাই ফিল্টার ডক্সে আসলে একটি উদাহরণ লুকানো আছে hidden


উদাহরণ:

আসুন আমরা আপনাকে এমন একটি ফিল্টার তৈরি করি যা নিয়মিত প্রকাশের সাথে জিনিসগুলিকে প্রতিস্থাপন করতে পারে:

myApp.filter("regexReplace", function() { // register new filter

  return function(input, searchRegex, replaceRegex) { // filter arguments

    return input.replace(RegExp(searchRegex), replaceRegex); // implementation

  };
});

সমস্ত অঙ্ক সেন্সর করার জন্য কোনও টেমপ্লেটে অনুরোধ:

<p>{{ myText | regexReplace: '[0-9]':'X' }}</p>

4
এইচটিএমএল টেমপ্লেট বাঁধাই {{ফিল্টার_প্রকাশ | ফিল্টার: এক্সপ্রেশন: তুলনাকারী}}, জাভাস্ক্রিপ্ট $ ফিল্টার ('ফিল্টার') (ফিল্টার_প্রকাশ, অভিব্যক্তি, তুলনাকারী)
— রোমান স্ক্লায়ারভ

@ পুলকিতসিংহাল আপনার অর্থ কি? জেএসফিডাল বা প্লঙ্কারে আপনার সমস্যাযুক্ত কোডটি দেখান।
— রোমান স্ক্লায়ারভ

আপনি কেবল জাভাস্ক্রিপ্টে ফিল্টার পোস্ট করলে ভাল হত
— ওবি

1
@ ওবিনুরাহ ঠিক আছে, স্রেফ জাফাস্ক্রিপ্টে কফিসিপিটি অনুবাদ করেছেন।
— এনএইচ 2

1
ভাল জিনিস. কেন এই উত্তর তালিকার শীর্ষে নেই?
— থেঠাকুরি

11

আমি নীচে উল্লেখ করেছি যেখানে আমি কাস্টম ফিল্টারটিও উল্লেখ করেছি, কীভাবে এই ফিল্টারটিকে কল করতে হবে যার দুটি পরামিতি রয়েছে

countryApp.filter('reverse', function() {
    return function(input, uppercase) {
        var out = '';
        for (var i = 0; i < input.length; i++) {
            out = input.charAt(i) + out;
        }
        if (uppercase) {
            out = out.toUpperCase();
        }
        return out;
    }
});

এবং এইচটিএমএল থেকে টেমপ্লেটটি ব্যবহার করে আমরা সেই ফিল্টারটিকে নীচের মতো কল করতে পারি

<h1>{{inputString| reverse:true }}</h1>

এখানে যদি আপনি দেখতে পান তবে প্রথম প্যারামিটারটি ইনপুটস্ট্রিং এবং দ্বিতীয় প্যারামিটারটি সত্য যা প্রতীকটি ব্যবহার করে "বিপরীত" এর সাথে মিলিত হয়েছে


4

আপনি যদি এনজি-অপশনগুলির মধ্যে আপনার ফিল্টারটি কল করতে চান তবে কোডটি নীচে থাকবে:

ng-options="productSize as ( productSize | sizeWithPrice: product )  for productSize in productSizes track by productSize.id"

যেখানে ফিল্টারটি আকারের সাথে প্রাইসফিল্টার এবং এটিতে দুটি পণ্য এবং পণ্য আকার রয়েছে



0

আপনার যদি ফিল্টারটির সাথে দু'একটি বেশি লেনদেনের প্রয়োজন হয় তবে তাদের চেইন করা সম্ভব:

{{ value | decimalRound: 2 | currencySimbol: 'U$' }} 
// 11.1111 becomes U$ 11.11

সম্ভাব্য প্রতিলিপির: stackoverflow.com/questions/16227325/...
— sjokkogutten

1
"আমি একাধিক যুক্তি সহ একটি Angular.js ফিল্টারকে কীভাবে কল করব?" এই প্রশ্নের উত্তর দেয় না? ("আমি কীভাবে একাধিক ফিল্টার কল করব?" এর চেয়ে)
— rom99

-1

এই কোডে, জসনডাটা হ'ল আমাদের অ্যারে এবং ফাংশন রিটার্নে আমরা জোসন্ডাটার উপস্থিত 'সংস্করণ' পরীক্ষা করে দেখছি।

var as = $filter('filter')(jsondata, function (n,jsondata){
   return n.filter.version==='V.0.3'
});

console.log("name is " + as[0].name+as[0]); 
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.