AngularJS Expressions

AngularJS သည် Expressions ကို အသုံးပြု၍ ဒေတာကို HTML နှင့် ပေါင်းစည်းသည် ။

AngularJS Expressions

AngularJS အသုံးအနှုန်းများကို double braces အတွင်းတွင် ရေးသားနိုင်သည် ။{{ expression }}

AngularJS အသုံးအနှုန်းများကို ညွှန်ကြားချက်တစ်ခုအတွင်းတွင်လည်း ရေးသားနိုင်သည် ။ng-bind="expression"

AngularJS သည် စကားရပ်ကို ဖြေရှင်းပေးမည်ဖြစ်ပြီး ရလဒ်ကို ထုတ်ဖော်ပြောဆိုသည့်နေရာတွင် အတိအကျ ပြန်ပေးပါမည်။

AngularJS အသုံးအနှုန်းများ သည် JavaScript အသုံးအနှုန်းများ နှင့် များစွာတူသည် - ၎င်းတို့တွင် စာသားများ၊ အော်ပရေတာများနှင့် ကိန်းရှင်များ ပါဝင်နိုင်သည်။

ဥပမာ {{ 5 + 5 }} သို့မဟုတ် {{ firstName + " " + lastName }}

ဥပမာ

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="">
<p>My first expression: {{ 5 + 5 }}</p>
</div>

</body>
</html>

အကယ်၍ သင်သည် ng-appညွှန်ကြားချက်ကို ဖယ်ရှားပါက၊ HTML သည် ၎င်းကို ဖြေရှင်းခြင်းမပြုဘဲ ၎င်းအတိုင်း စကားရပ်ကို ပြသလိမ့်မည်-

ဥပမာ

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div>
<p>My first expression: {{ 5 + 5 }}</p>
</div>

</body>
</html>

သင်နှစ်သက်သည့်နေရာတိုင်းတွင် စကားအသုံးအနှုန်းများကို ရေးသားနိုင်သည်၊ AngularJS သည် စကားရပ်ကို ရိုးရိုးရှင်းရှင်းဖြေရှင်းပြီး ရလဒ်ကို ပြန်ပေးလိမ့်မည်။

ဥပမာ- AngularJS သည် CSS ဂုဏ်သတ္တိများ၏ တန်ဖိုးကို ပြောင်းလဲပါစေ။

၎င်း၏တန်ဖိုးကိုပြောင်းလဲခြင်းဖြင့် အောက်ဖော်ပြပါ ထည့်သွင်းဘောက်စ်၏ အရောင်ကို ပြောင်းလဲပါ။

ဥပမာ

AngularJS နံပါတ်များ

AngularJS နံပါတ်များသည် JavaScript နံပါတ်များနှင့်တူသည်-

ဥပမာ

<div ng-app="" ng-init="quantity=1;cost=5">

<p>Total in dollar: {{ quantity * cost }}</p>

</div>

တူညီသောဥပမာကိုအသုံးပြုသည် ng-bind:

ဥပမာ

<div ng-app="" ng-init="quantity=1;cost=5">

<p>Total in dollar: <span ng-bind="quantity * cost"></span></p>

</div>

သုံး ng-initတာက သိပ်အသုံးများတာ မဟုတ်ဘူး။ Controller များအကြောင်း အခန်းတွင် ဒေတာကို အစပြုရန် ပိုမိုကောင်းမွန်သောနည်းလမ်းကို သင်လေ့လာနိုင်မည်ဖြစ်ပါသည်။

AngularJS စာကြောင်းများ

AngularJS စာကြောင်းများသည် JavaScript ကြိုးများနှင့်တူသည်-

ဥပမာ

<div ng-app="" ng-init="firstName='John';lastName='Doe'">

<p>The name is {{ firstName + " " + lastName }}</p>

</div>

တူညီသောဥပမာကိုအသုံးပြုသည် ng-bind:

ဥပမာ

AngularJS အရာဝတ္ထုများ

AngularJS အရာဝတ္ထုများသည် JavaScript အရာဝတ္ထုများနှင့်တူသည်-

ဥပမာ

<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">

<p>The name is {{ person.lastName }}</p>

</div>

တူညီသောဥပမာကိုအသုံးပြုသည် ng-bind:

ဥပမာ

AngularJS Arrays

AngularJS array များသည် JavaScript array များနှင့်တူသည်-

ဥပမာ

<div ng-app="" ng-init="points=[1,15,19,2,40]">

<p>The third result is {{ points[2] }}</p>

</div>

တူညီသောဥပမာကိုအသုံးပြုသည် ng-bind:

ဥပမာ

<div ng-app="" ng-init="points=[1,15,19,2,40]">

<p>The third result is <span ng-bind="points[2]"></span></p>

</div>