AngularJS အနန်း

AngularJS အနန်းAngularJS အောက်ပိုင်းအရာများကို ကိုင်တွယ်ကြသည်

AngularJS အင်တာကြီးများ JavaScript အပြည့်အဝိုက်

AngularJS အနန်း

AngularJS အောက်ပိုင်းအရာများကို အင်တာကြီးများကစွာကိုင်ကြသည်

ng-controller အမိန့်ကို အောက်ပိုင်းအရာအင်တာကြီး

နှင့်အတူအပြည့်အဝိုက်သည် လက်တွေ့ပြီးပြီ JavaScript အပြည့်အဝိုက်

AngularJS အချက်

<div ng-app="myApp" ng-controller="myCtrl">  
အမည်: <input type="text" ng-model="firstName"><br>  
အမည်: <input type="text" ng-model="lastName"><br>  
<br>  
အမည်အပါး: {{firstName + " " + lastName}}  
<script> var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.firstName = "Bill"; $scope.lastName = "Gates"; }); </script>

亲自试一试

အောက်ပိုင်းအရာ အကြောင်းကြားချက်

AngularJS အောက်ပိုင်းအရာများ ng-app="myApp" ဒဏ္ဍာန်းချက်များကိုပေးသည့် <div> အတွင်းတွင် လက်တွေ့ပြီးပြီ

ng-controller="myCtrl" အချက်အလက် သည် အင်္ဂလိပ်ဂျူနီယံ အော်ဂိုလီဇ် အပြုအမူ တစ်ခု ဖြစ်သည်။ ပြုအမူ သည် အမှတ်ပြုအမျိုး ကို အစီအစဥ်ကို အသုံးပြုသည်。

myCtrl ပြောင်းလဲသော အပိုင်းအခြား သည် ဂျူနီယံ ပြောင်းလဲသော အပိုင်းအခြား တစ်ခု ဖြစ်သည်。

အင်္ဂလိပ်ဂျူနီယံ အော်ဂိုလီဇ် သည် $scope အခြား အချက်အလက် အချက်အလက်များ ကို အခုပတ် အမှတ်ပြုအမျိုး အား ခေါ်ဆိုသည်。

အင်္ဂလိပ်ဂျူနီယံ အော်ဂိုလီဇ် တွင် $scope သည် အောက်ပတ်အခြား အချက်အလက် (အောက်ပတ် အချက်အလက် နှင့် ပြောင်းလဲသော အပိုင်းအခြား များ) အချက်အလက်များ နှင့် ပြောင်းလဲသော အပိုင်းအခြား များ အချက်အလက်များ အချက်အလက်များ ရှိသည်)。

အမှတ်ပြုအမျိုး သည် နေရာ (firstName နှင့် lastName)တွင် အချက်အလက် နှစ်ခု (ပြောင်းလဲသော အပိုင်းအခြား) ကို ဖန်တီးပေးပါလိမ့်မယ်。

ng-model အပြုအမူ သည် အခုပတ်အခြား အချက်အလက် အချက်အလက် အထိ သတ်မှတ်ပေးသည် (firstName နှင့် lastName)。

အမှတ်ပြုအမျိုး နှင့် စနစ်

အထူးသဖြင့် အမှတ်ပြုအမျိုး တစ်ခု သည် အခုပတ်အခြား အချက်အလက် နှစ်ခု ကို အပြုအမူပေးသည်: lastName နှင့် firstName

အမှတ်ပြုအမျိုး သည် စနစ်သည် ကို ပါဝင်နိုင်သည် (ပြောင်းလဲသော အပိုင်းအခြား):

AngularJS အချက်

<div ng-app="myApp" ng-controller="personCtrl">  
အမည်: <input type="text" ng-model="firstName"><br>  
အမည်: <input type="text" ng-model="lastName"><br>  
<br>  
အဖြစ်အပျက်ဝီကီအက်စ်: {{fullName()}}  
<script> var app = angular.module('myApp', []); app.controller('personCtrl', function($scope) { $scope.firstName = "Bill"; $scope.lastName = "Gates"; $scope.fullName = function() { return $scope.firstName + " " + $scope.lastName; }; }); </script>

亲自试一试

အခြား ဖိုင်အချက်အလက်များ တွင် အမှတ်ပြုအမျိုး

အကယ်၍ အကြီးမားသော အောက်ပတ်ပုံး တွင် အမှတ်ပြုအမျိုး ကို အခြား ဖိုင်အချက်အလက်များ တွင် သို့မဟုတ် ထိန်းချုပ်လိမ့်မယ်。

သင့် လက်ဆုံးစား ပုံစံ <script> ခုံးလိုက် အမည် personController.js နောက်ဆုံး အခြား အမှတ်ပြုအမျိုး

AngularJS အချက်

<div ng-app="myApp" ng-controller="personCtrl">  
အမည်: <input type="text" ng-model="firstName"><br>  
အမည်: <input type="text" ng-model="lastName"><br>  
<br>  
အဖြစ်အပျက်ဝီကီအက်စ်: {{fullName()}}  
  
<script src="personController.js"></script>

亲自试一试

အခြား အမှတ်ပြုအမျိုး

နောက်လာမည့် အမှတ်ပြုအမျိုးမှာ ကျွန်တော်တို့ တွေ့သော အမှတ်ပြုအမျိုးတစ်ခု ကို ဖန်တီးပေးပါလိမ့်မယ်:

angular.module('myApp', []).controller('namesCtrl', function($scope) {
  $scope.names = [
    {name:'Jani',country:'Norway'},
    {name:'Hege',country:'Sweden'},
    {name:'Kai',country:'Denmark'}
  ];
});

将文件保存为 namesController.js

然后在应用程序中使用控制器文件:

AngularJS အချက်

  • {{ x.name + ', ' + x.country }}

亲自试一试