Ekspresi pada AngularJS ditulis dengan {{ ekspresi }} selain itu juga bisa diulis dengan perintah ng-bind =”ekspresi” . Dalam ekspresi ini kalian bisa mengisinya dengan literal, operator aritmatika (+, -, /, *). Langsung saja kita buat contohnya dengan menggunakan operator aritmatika.
![]() |
| Contoh Hasil AngularJS Operator Aritmatika |
Untuk codenya silahkan kalian lihat dibawah ini:
<!DOCTYPE html>
<html>
<head>
<title>Ekspresi dalam fungsi Aritmatika</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div ng-app="">
<p> Penjumlahan 5 + 5 = {{ 5+ 5 }}</p>
<p> Pengurangan 5 - 5 = {{ 5-5 }}</p>
<p> Pembagian 5 : 5 = {{ 5/5 }}</p>
<p> Perkalian 5 * 5 = {{ 5 * 5 }}</p>
</div>
</body>
</html>Baca Juga : Belajar AngularJS Perkenalan dan Cara Install AngularJS
Selanjutnya kita coba membuatka style untuk hasil operator aritmatika di atas, kita wadahi dalam div dimana div tersebut warnanya bisa diganti-ganti berdasarkan warna yang diinput oleh user.
Contoh gambarnya seperti dibwah ini:
![]() |
| Contoh penggunaan ng-init Angular JS |
untuk code nya bisa sobat lihat di bawah ini, saya rasa enggak perlu dijelasin silahkan kalian pahami sendiri code nya :
<!DOCTYPE html>
<html>
<head>
<title>Ekspresi dalam fungsi Aritmatika</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div ng-app="" ng-init="warna='white'">
<input type="text" ng-model="warna" placeholder="masukkan warna disini..">
<div style="background-color: {{warna}}; width: 300px;">
<p> Penjumlahan 5 + 5 = {{ 5+ 5 }}</p>
<p> Pengurangan 5 - 5 = {{ 5-5 }}</p>
<p> Pembagian 5 : 5 = {{ 5/5 }}</p>
<p> Perkalian 5 * 5 = {{ 5 * 5 }}</p>
</div>
</div>
</body>
</html>Keterangan Fungsi :
| ng-init | ng-init berfungsi untuk menampung nilai default, selain itu biasa digunakan untuk mengetahui nilai ekspresi secara realtime |
Perhatikan source code pada bagian 2, kita bisa memberi nilai pada CSS menggunakan ekspresi yang terdapat pada AngularJS, bagi kalian yang suka web disain sangat cocok digunakan untuk mengganti gambar secara dinamis. Jadi klien bisa memilih tanpa kita masuk ke source code.






