Mengubah Model Data dengan AngularJS
Halo teman-teman, Di kesempatan kali ini saya akan memberikan contoh sederhana controller bagi Mengubah Model Data dengan AngularJS.
oke tanpa basa basi dan tanpa panjang lebar, seketika saja kita mulai cara Mengubah Model Data dengan AngularJS.
Pertama-tama-tama seperti lazimnya siapkan text-editor yang kalian sayangi dan kalian cintai.
Lalu ketik source/kode html dibawah ini kedalam text-editor kalian :
<!DOCTYPE html>
<html>
<title>Model Data AngularJS</title>
<body>
<div ng-app=myApp ng-controller=myCtrl>
<h1 ng-click=changeName()>{{firstname}}</h1>
</div>
<p>klik nama diatas bagi mengubahNama function.</p>
<p>Contoh sederhana controller bagi mengubah model data.</p>
</body>
</html>
Nah apabila telah selesai dengan htmlnya sekarang ini masukan script angularjs nya dibawah ini :
<script src= https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js></script>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstname = Rizal;
$scope.changeName = function() {
$scope.firstname = Murihat;
}
});
</script>
Nah apabila telah selesai, seketika kalian simpan dan run/jalankan dibrowser yang kalian gunakan. Karenanya akan terlihat hasilnya seperti dibawah ini :
Hasil sebelum diklik
Hasil setelah diklik
Lumayan gampang bukan ? jadi seperti demikianlah cara Mengubah Model Data dengan AngularJS.
Oke pembahasan kali ini mengenai cara Mengubah Model Data dengan AngularJS lumayan hingga disini yaaa, hingga bertemu dikesempatan berikutnya ya 🙂
Sekianlah dan Terimakasih semoga bermanfaat.
Sumber https://kursuswebsite.org