در قسمت قبل ، نگاهی داشتیم به 4 نوع مختلف data binding در AngularJS 2.0. در قسمت جاری میخواهیم کیفیت کدهای کامپوننت لیست محصولات را با strong typing بهبود بخشیده و همچنین چرخهی حیات کامپوننتها را به همراه ایجاد custom pipes بررسی کنیم.
افزودن strong typing به کامپوننت نمایش لیست محصولات
یکی از مزایای کار با TypeScript امکان انتساب نوعهای مشخص یا سفارشی، به متغیرها و اشیاء تعریف شدهاست. برای مثال تاکنون هر ...
در قسمت قبل ، نگاهی مقدماتی داشتیم به مبحث data binding. در ادامه، این مبحث را به همراه pipes، جهت اعمال تغییرات بر روی اطلاعات، پیگیری خواهیم کرد.
انقیاد به خواص یا property binding
قابلیت property binding این امکان را فراهم میکند که یکی از خواص المانهای HTML را به مقادیر دریافتی از کلاس کامپوننت، متصل کنیم: <img [src]='producr.imageUrl'>
در این مثال، خاصیت src المان تصویر، به آدرس تصویر یک محصو ...
در قسمت قبل ، مقدمهای بر نحوهی تعریف یک کامپوننت در AngularJS 2.0 عنوان شد و همچنین نحوهی بوت استرپ و آغاز اینگونه برنامهها بررسی گردید. در این قسمت میخواهیم امکانات پیشرفتهتری از کامپوننتها را بررسی کنیم.
روشهای مختلف تعریف خاصیت template در یک کامپوننت در قسمت قبل ، روش تعریف inline یک template را مشاهده کردید: template:`
<div><h1>{{pageTitle}}</h1>
<div> ...
در قسمت قبل ، پیشنیازهای کار با AngularJS 2.0 مرور و دریافت شدند. اگر مطالب آنرا پیگیری کرده باشید، هم اکنون باید در پوشهی node_modules واقع در ریشهی پروژه، تمام اسکریپتهای لازم جهت شروع به کار با AngularJS 2.0 موجود باشند.
تعاریف مداخل فایل index.html یک سایت AngularJS 2.0
پروژهای که در اینجا در حال استفاده است یک برنامهی ASP.NET MVC 5.x است؛ اما الزامی هم به استفادهی از آن وجود ندارد. یا یک فایل index.htm ...
AngularJS یک فریم ورک جاوا اسکریپتی، برای ساخت برنامههای تک صفحهای سمت کاربر، توسط HTML ،CSS و جاوا اسکریپت است. این فریم ورک، حاوی اجزایی برای data binding، طراحی ماژولار، کار با سرویسهای سمت سرور وب و امثال آن است. Angular 2 بازنویسی کامل نگارش 1 آن است و اهداف زیر را دنبال میکند:
- سرعت بالاتر بارگذاری و اجرای کدها
- استفاده از آخرین فناوریهای وب مانند ES 6 و وب کامپوننتها با پشتیبانی تا IE 9.
- سطح A ...
قسمت اول این مطلب را در اینجا میتوانید مطالعه کنید. از سه سال قبل تا به این تاریخ، فرمت زیرنویسهای این سایت به صورت JSON تغییر پیدا کردهاست و یک چنین ساختار جدیدی را دارد: {
"userIsAuthorizedForCourseTranscripts": false,
"modules": [
{
"title": "Course Overview",
"clips": [
{
"title": "Course Overview",
"playerParameter ...
مدتی بود که سرعت آغاز ویژوال استودیو و همچنین تمام برنامههای دات نتی موجود، به نحو عجیبی کاهش پیدا کرده بودند. آغاز ویژوال استودیو گاهی تا 3 دقیقه هم طول میکشید. تا اینکه آغاز یک برنامه سادهی دات نتی را توسط برنامهی معروف Procmon بررسی کردم:
بله. همانطور که مشاهده میکنید، چون تعداد فونتهای نصب شدهی بر روی سیستم من بیش از اندازه است (1800 فونت)، این مشکل رخ میدهد. هر بار آغاز برنامههای دات نت، به همراه بررسی ت ...
تا اینجا « نحوهی نصب و راه اندازی TypeScript را در VSCode » به همراه « تنظیمات کامپایلر TypeScript » و « دریافت فایلهای d.ts. را توسط بستههای NodeJS » بررسی کردیم. در ادامه قصد داریم این تنظیمات را به نگارش کامل VS.NET نیز اعمال کنیم.
به روز رسانی وابستگیهای VS.NET
برای دریافت آخرین نگارش TypeScript نیاز است افزونههای آنرا از سایت رسمی زبان TypeScript دریافت و نصب کرد: http://www.typescriptlang.org/in ...
Decorators یا تزئین کنندهها و ReflectDecorators ، یکی از پیشنهادهای نگارش بعدی جاوا اسکریپت هستند (ECMAScript 2016) که هم اکنون قابلیت استفادهی از آنها در TypeScript وجود دارد.
جهت افزودن قابلیتهای meta-programming به زبانهای جاوا اسکریپت و TypeScript و همچنین تعریف annotations بر روی کلاسها و اعضای کلاس، میتوان از Decorators استفاده کرد. یک decorator، تعریف ویژهای است که میتواند به تعریف یک کلاس، متد، خاصیت و یا پ ...
برای کامپایل کدهای TypeScript به جاوا اسکریپت، علاوه بر پارامترهای کامپایلر، از تنظیمات فایل مخصوصی به نام tsconfig.json نیز استفاده میشود که این موارد را در قسمت جاری بررسی خواهیم کرد.
نحوهی اعمال تنظیمات کامپایلر TypeScript
روشهای متفاوتی جهت اعمال تنظیمات کامپایلر TypeScript وجود دارند:
الف) ذکر پارامترها و سوئیچهای کامپایلر خط فرمان tsc به صورت مستقیم.
ب) بعضی از ادیتورها و IDEها این پارا ...