Hallo teman-teman, balik lagi pada tutorial dumet school, pada tutorial kali ini kita akan belajar fungsi dari ng-model pada angular js.
Aplikasi yang yang dimana basic script didalamnya adalah script Javascript. Dengan menggunakan AngularJS.
ada banyak teknik yang digunakan dalam angular js ini, Salah satunya adalah teknik directive, diantaranya adalah ng-app dan ng-model, nah untuk pembahasan kali ini kita akan mempraktekan bagaimana ng-model itu berfungsi.
Mungkin untuk lebih jelasnya kita langsung saja praktekkan, silahkan teman-teman buat sebuah file html dan ketikan script berikut:
<!DOCTYPE html>
<html>
<body>
<div ng-app="">
<p>ketikan nama anda</p>
<p>nama : <input type="text" ng-model="nama" placeholder="ketikan nama anda"></p>
<h1>Hello {{nama}}</h1>
</div>
</body>
</html>
Penjelasan dari script diatas adalah saya membuat sebuah div dan memberikan fungsi ng-app yang menandakan bahwa script berikut adalah angular aplication, lalu saya membuat sebuah tag input text dimana saya menambahkan fungsi ng-model dengan nilai nama, lalu saya mencetak nilainya dengan menggunakan fungsi bawaan angular seperti script berikut:
<h1>Hello {{nama}}</h1>
ketentuan untuk mencetak nilai pada angular adalah :
<h1>Hello {{nama dari ng-model}}</h1>
jadi secara otomatis akan mencetak nilai yang kita ketikan pada teg input, oke kiranya cukup sekian untuk artikel kali ini, selamat mencoba.
Terimakasih