آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

آموزش فیلترها در AngularJS

دوره آموزش SPA

رمز فایل :tahlildadeh.com

 

کلیه حقوق مادی و معنوی این مقاله متعلق به آموزشگاه تحلیل داده می باشد و هر گونه استفاده غیر قانونی از آن پیگرد قانونی دارد.

 

فیلترها در AngularJS

فیلترها را می توان با یک کاراکتر " | " به عبارات (expression) و directive )دستورات ( اضافه کرد.

با بهره گیری از فیلترهای AngularJS می توان داده ها را تبدیل کرد:

فیلتر

شرح

currency

عدد را با فرمت پول رایج نمایش می دهد/فرمت عدد به پول رایج.

filter

یک زیر مجموعه از آیتم های موجود در یک آرایه را انتخاب کرده و برمی گرداند.

lowercase

فرمت یک رشته را به حروف کوچک تبدیل می کند و آن را با حروف کوچک نمایش می دهد.

orderBy

آرایه را بر اساس یک رشته مرتب می سازد.

uppercase

فرمت رشته را به حروف بزرگ تبدیل می کند.

افزودن فیلتر به عبارت ها

همان طور که بالا نیز گفته شد، یک فیلتر را می توان به وسیله ی کاراکتر " | " به عبارت مد نظر اضافه کرد. در دو مثال بعدی از همان کنترلگر person درس پیشین استفاده می کنیم.

فیلتر uppercase رشته ها را با حروف بزرگ نمایش می دهد:

نمونه یک

  

The name is {{ lastName | uppercase }}

امتحان کنید

فیلتر lowercase رشته ها را با حروف کوچک تبدیل کرده و نمایش می دهد:

نمونه دو

The name is {{ lastName | lowercase }}

امتحان کنید

فیلتر currency

فرمت یک عدد را به فرمت پول رایج تبدیل کرده یا به عبارتی یک عدد را به صورت (در قالب) پول رایج نمایش می دهد:

نمونه سه

    
Quantity: Price:

Total = {{ (quantity * price) | currency }}

امتحان کنید

افزودن فیلتر به Directive ها

فیلتر را می توان با استفاده از کاراکتر " | " به  directiveمورد نظر ضمیمه کرد.

orderBy یک آرایه را به وسیله ی یک عبارت (expression) مرتب می سازد:

نمونه چهار

 

Looping with objects:

  • {{ x.name + ', ' + x.country }}
امتحان کنید

 

فیلتر کردن ورودی

یک filter که برای فیلتر کردن و انتخاب ورودی های خاص در نظر گرفته شده است، به واسطه ی یک کاراکتر

 " | " به directive پیوست شده و به دنبال آن فیلتر مورد نظر، کاراکتر دو نقطه " : " و نام مدل تایپ می شوند.

Filter یک تعداد مشخص یا زیرمجموعه ای از آیتم های آرایه را انتخاب کرده و برمی گرداند:

نمونه پنج

    

Filtering input:

  • {{ (x.name | uppercase) + ', ' + x.country }}
امتحان کنید

 

  • 1201
  •    1128
  • تاریخ ارسال :   1394/09/17

دانلود PDF دانلود سورس کد دانشجویان گرامی اگر این مطلب برای شما مفید بود لطفا ما را در GooglePlus محبوب کنید
رمز عبور: tahlildadeh.com یا www.tahlildadeh.com
ارسال دیدگاه نظرات کاربران
شماره موبایل دیدگاه
عنوان پست الکترونیک

ارسال

آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

تمامی حقوق این سایت متعلق به آموزشگاه تحلیل داده می باشد .