کنترل DatePicker متریال در انگولار ۷ – آموزش انگولار متریال

  • چهارشنبه ۲۰ شهریور ۱۳۹۸
  • بازدید ۱۰۹ نفر

angular material 7 datepicker 6334 تصویر

کنترل DatePicker متریال در انگولار ۷

<mat-datepicker> یک دستورالعمل انگولار است که به منظور ایجاد کنترل انتخاب کننده تاریخ (DatePicker) استفاده می شود. در این بخش چگونگی ایجاد و استفاده از یک کنترل datepicker در انگولار را بررسی خواهیم کرد.

ایجاد برنامه انگولار

در ادامه برنامه ای که در بخش ایجاد پروژه در انگولار ۷ ایجاد کرده بودیم را برای استفاده از کنترل autocomplete تغییر می دهیم.

محتوای فایل app.module.ts را مانند نمونه زیر تغییر دهید:

محتوای فایل app.component.html:

نتیجه

بعد از اجرا برنامه خروجی زیر را مشاهده خواهید کرد:

angular material 7 datepicker 6334 1 تصویر

جزئیات

  • در ابتدا ما یک input ساخته ایم و یک datepicker با نام picker را با خاصیت [matDatepicker] به آن وصل کرده ایم.
  • سپس، با استفاده از تگ mat-datepicker یک datepicker به نام picker ایجاد کردیم.
ثبت نظر
ریفریش کنید!
نظرات کاربران (۴ مورد)
  1. تصویر آواتار کاربر 0
    مهدی یکشنبه , ۲۴ شهریور

    سلام بقیه کنترل ها رو کی میزارین؟

    • تصویر آواتار کاربر 124
      AmRoیکشنبه , ۲۴ شهریور

      سلام..فایلهای آموزشی آماده شده و به زودی بر روی سایت قرار میگیرد.

  2. تصویر آواتار کاربر 0
    Hassan یکشنبه , ۲۴ شهریور

    سلام میخواستم بدونم میشه کنترل DatePicker متریال رو به صورت شمسی کرد یا خیر.