আমি একাধিক যুক্তি সহ একটি 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.