معرفی ng-init به عنوان یک دستور دهنده (Directive) برای تعریف اولیه بخشی از اطلاعات اپلیکیشن (Application)، در AngularJS
ng-init ، یک دستور دهنده (Directive) می باشد که با استفاده از آن می توانیم یک سری اطلاعات را به عنوان اطلاعات اولیه اپلیکیشن (Application)، تعریف نماییم.
این اطلاعات که توسط ng-init تعریف می شوند، می توانند مواردی مثل متغیر اپلیکیشن (Application Variable) از نوع مقدار عددی (Number) یا رشته (String)، آرایه (Array) یا شیء (Object)، باشند.
تعریف متغیر اپلیکیشن (Application Variable) از نوع مقدار عددی (Number) یا رشته (String)، توسط ng-init :
به عنوان مثال، کد زیر را ببینید :
که در آن، مقدار زیر برای ng-init نوشته شده است :
که باعث می شود یک متغیر اپلیکیشن با نام websiteAddress و از جنس رشته (String) و با مقدار kelidestan.com تعریف شود (به علامت های ' در دو طرف رشته، دقت کنید) و همچنین یک متغیر اپلیکیشن با نام number و مقدار 30 تعریف گردد. در پایان تعریف هر کدام، علامت ; را نوشته ایم که از تداخل آنها با هم، جلوگیری می کند و می توانید تعریف های مختلف را به صورت جداگانه تشخیص دهید.
حال همین کد را در یک مثال کامل (کدهای یک صفحه) به کار می بریم و همچنین با استفاده از ng-bind ، مقدار این دو متغیر را که تعریف شده اند، در خروجی صفحه نمایش خواهیم داد :
کدهای نمایش دو متغیر websiteAddress و number به صورت زیر نوشته شده اند :
نتیجه :
تعریف آرایه (Array) توسط ng-init :
برای تعریف آرایه (Array)، می توانیم ng-init را مشابه کد زیر بنویسیم :
که در آن، یک آرایه (Array) با نام numbers را با کد زیر تعریف کرده ایم :
البته یک متغیر اپلیکیشن (Application Variable) از جنس رشته (String) را هم در کنار آن تعریف کرده ایم تا نحوه تعریف چند مورد با هم را فراموش نکنید.
سپس به عنوان مثل، برای فراخوانی عنصر متناظر با شماره 2 از این آرایه، باید کد زیر نوشته شود (با استفاده از ng-bind در صفحه) :
در آرایه ها (Array)، شماره متناظر با عنصرها، از عدد 0 شروع می شود (نه عدد 1)، بنابراین عنصر متناظر با شماره 2 ، در واقع سومین عنصر از آرایه (Array) می باشد.
کد کامل همین مثال :
نتیجه :
تعریف شیء (Object) توسط ng-init :
برای تعریف شیء (Object) ، کدهای مربوط به ng-init را به صورت زیر می نویسیم :
که در آن، بخش زیر برای تعریف یک شیء (Object) با نام user به کار رفته است :
همچنین در کنار آن، یک متغیر اپلیکیشن (Application Variable) از جنس رشته (String) نیز تعریف نموده ایم.
شیء (Object) مورد نظر دارای نام user بوده و سه مورد زیر (سه متغیر) در آن تعریف شده است :
دو مورد اول از نوع رشته (String) بوده و سومی دارای مقدار عددی (Number) می باشد (دو متغیر از نوع رشته و یک متغیر با مقدار عددی). برای فراخوانی هر یک از آنها، ابتدا باید نام شیء (Object) ذکر شود و سپس، یک علامت نقطه بنویسیم و در آخر، نام مربوط به آن متغیر ذکر گردد، به عنوان مثال، user.age مقدار متناظر با متغیر age را فراخوانی می کند.
اکنون برای فراخوانی از شیء (Object) تعریف شده (با استفاده از ng-init)، کدهای زیر را می نویسیم :
همین کدها را در یک مثال کامل، ذکر می کنیم :
نتیجه :
- فهرست مباحث
- 1 معرفی چارچوب AngularJS برای ساخت اپلیکیشن های تک صفحه ای تحت وب
- 2 به کار بردن AngularJS در یک صفحه از وب سایت
- 3 دستور دهنده ها (Directive)، در AngularJS
- 4 معرفی دستور دهنده های (Directive های) ng-app و ng-model و ng-bind و کاربرد آنها، در AngularJS
- 5 معرفی ng-init به عنوان یک دستور دهنده (Directive) برای تعریف اولیه بخشی از اطلاعات اپلیکیشن (Application)، در AngularJS
- 6 عبارت ها (Expression)، در AngularJS
- 7 معرفی ng-repeat به عنوان یک دستور دهنده (Directive) برای کدنویسی ساده تر به منظور نمایش اطلاعات یک آرایه (Array) در عنصرهایی از صفحه مثل فهرست (List) یا جدول (Table)، در AngularJS
- 8 کنترل کننده ها (Controller)، در AngularJS
-
نکته : این فهرست مباحث، صرفا منتخبی از کلیدهای آموزشی این موضوع است (که خواندن متوالی آنها توصیه می شود) و برای دیدن کلیدهای آموزشی بیشتر از این موضوع، می توانید بر روی دسته بندی های ستون سمت راست کلیک نمایید.