ຄວາມຄິດສະໜອງ AngularJS

ຄວາມຄິດສະໜອງ AngularJSຄວາມຄວບຄຸມຂໍ້ມູນຄອມພິວເຕີ້ AngularJS.

AngularJS ຄວາມຄວບຄຸມທີ່ປົກກະຕິ ບັນດາວັດສະດຸ JavaScript.

ຄວາມຄິດສະໜອງ AngularJS

AngularJS ຄວາມຄວບຄຸມຄອມພິວເຕີ້.

ng-controller ສັນຍາການຄວາມຄວບຄຸມຄອມພິວເຕີ້.

ຄວາມຄວບຄຸມຈາກວຽກງານຄອມພິວເຕີ້ JavaScript ບັນດາວັດສະດຸ 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}}  
</div>  
<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" ບັນດາມະນຸດແມ່ນຄຳສັ່ງ AngularJS. ມັນກໍ່ພົບຄວາມຄິດ.

myCtrl ວິທີການແມ່ນວິທີຈາກ JavaScript.

AngularJS ຈະໃຊ້ $scope ບັນດາມະນຸດຢູ່ໃນຕົວແທນຫນັງຄວາມຄິດຢູ່ໃນຄວາມຄິດ:

ໃນ AngularJS, $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()}}  
</div>  
<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>

ທ່ານຈະສອບສວນດຽວກັນ

ຄວາມຄິດນອກບັນນາທິດ

ໃນການຂຽນຄວາມຫນັງຄວາມຄິດທີ່ໃຫຍ່ຫນັງຄວາມຄິດສະໄໝການບັນນາທິດນອກບັນນາທິດແມ່ນສິ່ງທີ່ຈະງາຍຢູ່ຢ່າງດີ:

ພຽງແຕ່ຖືກສໍາລັບການສ້າງ 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()}}  
</div>  
<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

<div ng-app="myApp" ng-controller="namesCtrl">
<ul>
  <li ng-repeat="x in names">
    {{ x.name + ', ' + x.country }}
  </li>
</ul>
</div>
<script src="namesController.js"></script>

ທ່ານຈະສອບສວນດຽວກັນ