کار با درخواستهای Delete در Angular
شناسه پست: 4001
بازدید: 822

برای تمام کردن قسمت کد نویسی این آموزش گام به گام، می خواهیم logic حذف entity را پیاده سازی کنیم. برای انجام این کار، ما قصد داریم یک form برای پشتیبانی از این عمل و ارسال درخواست DELETE به سرور ایجاد کنیم.

اگر می خواهید تمام آموزشهای لازم و پایه مربوط به آموزش گام به گام Angular را ببینید ، لطفاً روی این لینک کلیک کنید: مقدمه آموزش گام به گام Angular.

ساختار پوشه و Routing

با اجرای دستور Angular CLI شروع میکنیم، که ساختار پوشه مورد نیاز را ایجاد می کند. علاوه بر این، این دستور، کامپوننت OwnerDelete را در فایل owner.module.ts ایمپورت می کند:

علاوه بر این، باید فایل owner-routing.module.ts را برای فعال کردن routing برای این component تغییر دهیم:

علاوه بر این، فایل owner-list.component.html را به این صورت نیز اصلاح میکنیم:

و فایل owner-list.component.ts برای فعال کردن navigation به صفحه delete:

آماده سازی صفحه برای اقدامات Delete در Angular

برای ایجاد قسمت HTML کامپوننت، با این کد wrapper شروع میکنیم:

در داخل عنصر div با کلاس col-md-10، می‌خواهیم تمام جزئیات مربوط به entity را که می‌خواهیم حذف کنیم را نشان دهیم:

درست زیر آخرین عنصر div، دکمه ها را اضافه میکنیم:

در حال حاضر قست HTML کامپوننت آماده است. تنها کاری که باید انجام دهیم این است که business logic را پیاده سازی کنیم.

مدیریت اقدامات Delete در فایل Component

با دستورهای import در فایل owner-delete.copmonent.ts شروع میکنیم:

سپس، ویژگی های لازم را ایجاد کرده و service ها را در داخل سازنده inject میکنیم:

در زیر سازنده، می‌خواهیم logic مربوط به fetch کردن owner و هدایت به کامپوننت owner-list را اضافه کنیم:

همه چیز اینجا با توجه به پست های قبلی آشنا به نظر میرسد.

در نهایت، delete logic را درست در زیر تابع redirectToOwnerList پیاده سازی میکنیم:

تمام. ما قسمت Angular خود در این اپلیکیشن را به پایان رساندیم. در نتیجه، در حال حاضر، ما یک برنامه کاملا کاربردی آماده برای استقرار داریم. بنابراین، تنها کاری که باید انجام دهیم این است که فایل های Angular را برای تولید آماده کرده و برنامه تکمیل شده را مستقر کنیم.

نتیجه گیری

با خواندن این پست یاد گرفتید:

  • نحوه ایجاد قسمت HTML اکشن delete
  • نحوه ارسال درخواست DELETE به سرور

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

نویسنده

امید عباسی
من امید عباسی هستم. سالهاست که در زمینه برنامه نویسی با تکنولوژی دات نت فعالیت میکنم و عاشق این هستم که تجربیات و دانش خودم را در این زمینه با دیگران به اشتراک بزارم. خیلی دوست دارم که نظر و انتقاد خودتون رو در مورد این نوشته برای من بنویسید تا بتونم در آینده، مطالب بهتر و ارزشمندتری را برای شما فراهم کنم. در صورت داشتن هرگونه سوال هم در قسمت دیدگاه ها میتونید با بنده در ارتباط باشید