AngularJS အဘောင်

AngularJS သည် ကိုယ်ပိုင် HTML အခင်းမှု အမိန့်ချက် ကို ပြုပြင်နိုင်ပါသည်။

AngularJS အဘောင်

အောက်ပါ အမိန့်ချက် တစ်ခုခုကို သုံးပြု၍ သင့် HTML အရာတွင် AngularJS အခင်းမှု အစီအစဉ်ကို ထိန်းချုပ်နိုင်ပါသည်။

  • ng-blur
  • ng-change
  • ng-click
  • ng-copy
  • ng-cut
  • ng-dblclick
  • ng-focus
  • ng-keydown
  • ng-keypress
  • ng-keyup
  • ng-mousedown
  • ng-mouseenter
  • ng-mouseleave
  • ng-mousemove
  • ng-mouseover
  • ng-mouseup
  • ng-paste

အခင်းမှု အမိန့်ချက် အားဖြင့် အသုံးပြုသူ အခင်းမှု တွင် AngularJS ပြောင်းလဲကုသမှု အသုံးပြုနိုင်ပါသည်။

AngularJS အချက်အလက် သည် HTML အချက်အလက် ကို ပြောင်းလဲ မဟုတ် သည် ဖြစ် ပြီး နှစ်ခု စလုံး ပြောင်းလဲသည်

ကြိမ်တော် အချက်အလက်

အရာ ပေါ်တွင် ကြိမ်တော် ပြောင်းလဲသည် အခါ၌ ကြိမ်တော် အချက်အလက် သည် အခြား အချက်အလက် အား အသုံးပြု သည်

  • ng-mouseover
  • ng-mouseenter
  • ng-mousemove
  • ng-mouseleave

သို့မဟုတ် အရာကို နှုတ်ကို သတ်ပေး ပြီး အရာကို ပြောင်းလဲသည် အခါ၌ ပြောင်းလဲသည်

  • ng-mousedown
  • ng-mouseup
  • ng-click

အရာတစ်ခု ကို အခြား အရာ အား အသုံးပြု နိုင်သည်

အမှတ်

ကြိမ်တော် အရာ ပေါ်တွင် ပြောင်းလဲသည် အခါ၌ ပြောင်းလဲသည်

<div ng-app="myApp" ng-controller="myCtrl">  
<h1 ng-mousemove="count = count + 1">ကြိမ်တော်ကို ပေါ်တွင် ပြောင်းလဲပေးသည်!</h1>  
<h2>{{ count }}</h2>  
</div>  
<script>  
var app = angular.module('myApp', []);  
app.controller('myCtrl', function($scope) {  
  $scope.count = 0;  
});  
</script>

ကိုယ်တိုင် ကြိုးစားပါ

ng-click အမည်သံ

ng-click အမည်သံ သည် အရာကို နှုတ်ကို သတ်ပေး ပြီး အရာကို ပြောင်းလဲသည်

အမှတ်

<div ng-app="myApp" ng-controller="myCtrl">
<button ng-click="count = count + 1">Click me!</button>
<p>{{ count }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.count = 0;
});
</script>

ကိုယ်တိုင် ကြိုးစားပါ

သို့မဟုတ် ပြောင်းလဲသည်

အမှတ်

<div ng-app="myApp" ng-controller="myCtrl">
<button ng-click="myFunction()">Click me!</button>
<p>{{ count }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.count = 0;
  $scope.myFunction = function() {
    $scope.count++;
  }
});
</script>

ကိုယ်တိုင် ကြိုးစားပါ

ပြောင်းလဲသည်

ဖြစ်စေ၍ အရာတစ်ခု ကို နှုတ်ကို သတ်ပေး ပြီး အခြား အရာတစ်ခု ကို ကွက်လွှတ် သည် ကဲ့သို့ ဖြိုဖြိုသည် လိုဖြစ်လျှင် ဘက်ဆက် ကို ပြောင်းလဲသည် အဖြစ် ပြုလုပ်ပါ

နှုတ်ကို သတ်ပေးသည်

အမှတ်

<div ng-app="myApp" ng-controller="myCtrl">  
<button ng-click="myFunc()">နှုတ်ကို သတ်ပေးသည်!</button>  
<div ng-show="showMe">  
  <h1>စားသောက်ဆိုင်:</h1>  
  <div>披萨</div>  
  <div>意大利面</div>  
  <div>海鲜</div>  
</div>  
</div>  
<script>  
var app = angular.module('myApp', []);  
app.controller('myCtrl', function($scope) {  
  $scope.showMe = false;  
  $scope.myFunc = function() {  
    $scope.showMe = !$scope.showMe;  
  }  
});  
</script>

ကိုယ်တိုင် ကြိုးစားပါ

showMe သဘောတူ သည် စတင်က ဘားရှိ သည် false

myFunc ပြောင်းလဲသည် !(ဝေးသော)ပြောင်းလဲသည် showMe သဘောတူ ကို အရာ၏ လက်ရှိ အတွက် ကို ပြောင်းလဲသည်

$event အရာ

ပြောင်းလဲသည် $event အရာတစ်ခု သည် ပြင်းပြင်းလျှင် ပြောင်းလဲသည်

$event အမှုသိမ်း အော်ဒါ ကို ပါဝင်သည်:}}

အမှတ်

<div ng-app="myApp" ng-controller="myCtrl">
<h1 ng-mousemove="myFunc($event)">မိုးစွန်းအား အထက်သို့ ပြောင်းလဲပါ!</h1>
<p>Coordinates: {{x + ', ' + y}}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.myFunc = function(myE) {
    $scope.x = myE.clientX;
    $scope.y = myE.clientY;
  }
});
</script>

ကိုယ်တိုင် ကြိုးစားပါ