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

محدوده (Scope) در AngularJS

 

دوره آموزشی AngularJS

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

محدوده (Scope) در AngularJS

Scope را می توان به چند طریق تعریف کرد:

به قسمتی که HTML (view) و JavaScript (Controller) را بهم پیوند می دهد ، Scope می گویند.

به یک object با ویژگی ها و متدهای قابل دسترس نیز Scope می گویند. Scope هم برای view و هم برای Controller قابل دسترس می باشد.

چگونه از Scope استفاده کنیم؟

زمانی که شما یک Controller در AngularJS ایجاد می کنید، یک object $scope به عنوان argument ایجاد می شود. در مثال زیر، ویژگی های ساخته شده در Controller، می توانند به view ارجاع داده شوند.

نمونه 1

{{carname}}

امتحان کنید

هرگاه به $scope در Controller ویژگی هایی اضافه کنیم،view (HTML) می تواند به این ویژگی ها دسترسی داشته باشد. شما نباید از پیشوند $scope در view استفاده کنید بلکه فقط باید به نام آن ویژگی ارجاع دهید، به عنوان مثال باید به صورت {{carname}} بنویسید.

درک کردن Scope

یک برنامه کاربردی AngularJS شامل بخش های زیر می باشد:

·        View که شامل کدهای Html است.

·        Model که view مربوط به آن دسترسی دارد.

·        Controller که با استفاده از توابع JavaScript، اطلاعات را ایجاد کند، تغییر دهد، حذف کند و یا کنترل کند.

Scope یک object با ویژگی ها و متدهایی است که هم برای view و Controller قابل دسترسی باشد. به عنوان مثال، هر گاه شما در view تغییراتی ایجاد کنید، model و Controller به روز رسانی می شوند.

نمونه 2

My name is {{name}}

امتحان کنید

Scope خود را بشناسید

این نکته بسیار مهم است که شما بدانید از کدام Scope باید استفاده کنید. در دو مثال قبلی تنها یک Scope وجود داشت و شناختن Scope کار دشواری نبود اما برای برنامه های بزرگتر Section هایی از  HTML DOM وجود دارد که برای هر Scope یکتای خود قابل دسترسی می باشد.

به عنوان مثال، هرگاه از دایرکتیو ng-repeat استفاده می کنیم، هر تکرار به همان object  تکرار شده دسترسی دارد.

نمونه 3

  • {{x}}
امتحان کنید

هر المان

  • به همان object تکرارشونده دسترسی دارد. در این مورد یک رشته با x نشان داده شده است.

    Scope ریشه

    هر برنامه ی کاربردی، یک $rootScope دارد که Scope ساخته شده در المان Html آن دارای دایرکتیو ng-app می باشد. rootScope در کل برنامه قابل دسترسی است و اگر یک متغیر دارای نام های مشابه در Current Scope و rootScope باشد، برنامه یکی از آنها را استفاده می کند.

    به عنوان مثال، یک متغیر به نام color هم در Scope Controller و هم در rootScope وجود دارد.

          

    نمونه 4

    
    

    The rootScope's favorite color:

    {{color}}

    The scope of the controller's favorite color:

    {{color}}

    The rootScope's favorite color is still:

    {{color}}

    امتحان کنید

     

     

    • 920
    •    1076
    • تاریخ ارسال :   1394/12/21

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

    ارسال

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

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