{"id":5864,"date":"2020-10-09T09:11:20","date_gmt":"2020-10-09T09:11:20","guid":{"rendered":"https:\/\/hosteko.com\/blog\/?p=5864"},"modified":"2020-10-17T01:05:00","modified_gmt":"2020-10-17T01:05:00","slug":"mengenal-tentang-angularjs","status":"publish","type":"post","link":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs","title":{"rendered":"Mengenal tentang AngularJS"},"content":{"rendered":"<h1><strong>Pengertian AngularJS<\/strong><\/h1>\n<p><strong>AngularJS<\/strong> merupakan salah satu jenis framework dari JavaScript yang menggunakan metode MVC (Model View Controller) dan saat ini dikelola oleh Google. Dimana metode MVC tersebut memiliki fungsi sebagai metode yang dapat memudahkan aplikasi untuk dikembangkan serta dilakukan pembersihan. AngularJS awal di kembangkan tahun 2009 oleh <strong>Misko Hevery<\/strong> dan <strong>Adam Abrons.<\/strong><\/p>\n<p>AngularJS juga dapat di artikan sebagai kerangka framework bersifat terbuka atau open source dalam penggunaannya bebas dikembangkan serta diterapkan oleh siapa saja. Oleh sebab itu banyak developer di seluruh dunia menggunakan framework ini sebagai pengembangan aplikasi atau website.<\/p>\n<p>Pengelolaan dilakukan oleh Google menjadikan framework ini terpercaya serta memiliki performa tinggi, selain itu juga memiliki situs resmi untuk memberikan kemudahan pengguna dengan memberikan panduan atau petunjuk penggunaan. AngularJS menjadi front-end framework yang digunakan membangun aplikasi bersifat single page application.<\/p>\n<p>Memiliki sifat dinamis yang memudahkan penerapan serta pengembangan HTML menjadi lebih luas. Penerapannya dalam aplikasi atau website memerlukan directive atau penanda elemen Document Object Model.<\/p>\n<p>AngularJS memiliki bagian utama yang mempengaruhi proses kerja dari framework tersebut, bagian utama tersebut berupa :<\/p>\n<ul>\n<li><strong>Ng- App<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\"><strong>Ng-app<\/strong>\u00a0adalah sebuah\u00a0directive\u00a0yang akan membuat elemen tersebut dan anaknya dianggap sebagai aplikasi Angular.js, semua\u00a0controller\u00a0dan\u00a0scope\u00a0yang didefinisikan dalam kode Javascript akan hanya berjalan di dalam\u00a0<strong>div<\/strong>\u00a0yang memuat\u00a0directive\u00a0<strong>ng-app<\/strong>.<\/p>\n<ul>\n<li><strong>Ng- Model<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Ng- Model\u00a0memberikan arahan data aplikasi ke input kontrol HTML.<\/p>\n<ul>\n<li><strong>Ng- Bind<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Ng- Bind arahan data dari aplikasi Angular JS ke tag html.<\/p>\n<p>Definisi AngularJS seperti menempatkan dengan dokumen yang resmi sebagai berikut :<\/p>\n<ul>\n<li><strong>AngularJS<\/strong> adalah Framework struktural untuk aplikasi web dinamis. Ini memungkinkan untuk menggunakan HTML sebagai bahasa template dan memungkinkan memperluas sintaks HTML untuk mengekspresikan komponen aplikasi secara jelas dan ringkas. Sudut yang mengikat data dan ketergantungan injeksi menghilangkan banyak kode yang dimiliki untuk menulis. Dan itu semua terjadi dalam browser, sehingga adalah pasangan yang ideal dengan teknologi server apapun.<\/li>\n<li><strong>AngularJS<\/strong> adalah\u00a0front-end framework untuk javascript yang dikembangkan oleh Google. Dengan fitur-fitur powerfull dari AngularJS, proses development bisa menjadi jauh lebih singkat.<\/li>\n<\/ul>\n<h1><strong>Fitur-fitur AngularJS<\/strong><\/h1>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-5879 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS1.png\" alt=\"\" width=\"1442\" height=\"1102\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS1.png 1442w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS1-1024x783.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS1-768x587.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS1-555x424.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS1-1110x848.png 1110w\" sizes=\"auto, (max-width: 1442px) 100vw, 1442px\" \/><\/p>\n<p>Dalam melakukan kerjanya tentu AngularJS memiliki berbagai fitur yang mudah dipelajari menjadikan proses lebih singkat dilakukan. Fitur tersebut memiliki dua jenis yaitu :<\/p>\n<h3><strong>1. Fitur utama AngularJS<\/strong><\/h3>\n<p>Berikut ini adalah beberapa fitur utama AngularJS, yaitu :<\/p>\n<ol>\n<li>Framework dengan bahasa pemrograman JavaScript yang efisien untuk membangun Rich Internet Applications (RIA).<\/li>\n<li>Menggunakan metode MVC (Model View Controller) yang memudahkan dalam melakukan penulisan aplikasi atau pilihan pengembang pada sisi atau sudut pandang dari klien.<\/li>\n<li>Aplikasi yang ditulis dalam AngularJS cross-browser compliant. AngularJS secara otomatis menangani kode JavaScript yang cocok untuk masing-masing browser.<\/li>\n<li>AngularJS adalah open source, sepenuhnya gratis dan digunakan oleh ribuan pengembang di seluruh dunia. Hal ini berlisensi di bawah lisensi Apache versi 2.0.<\/li>\n<li>Secara keseluruhan, AngularJS adalah suatu framework kerja untuk membangun kinerja tinggi aplikasi web sementara menjaga sebagai cara termudah untuk mempertahankan dan skala besar.<\/li>\n<\/ol>\n<h3><strong>2. Fitur inti atau core dalam AngularJS<\/strong><\/h3>\n<p>Berikut ini adalah fitur inti atau core dalam AngularJS, yaitu :<\/p>\n<ul>\n<li>\n<h3><strong>Data Binding<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Berfungsi untuk sinkronisasi atau penyesuaian antara Model dan View pada AngularJS.<\/p>\n<ul>\n<li>\n<h3><strong>Scope atau Lingkup<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Berguna untuk menempelkan antara Controller dan View yang berbentuk objek mengacu pada Model.<\/p>\n<ul>\n<li>\n<h3><strong>Controller<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Kumpulan fungsi-fungsi JavaScript yang dibuat pada AngularJS.<\/p>\n<ul>\n<li>\n<h3><strong>Service atau Layanan<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Pelayanan pada AngularJS yang berbentuk objek tunggal sekali pakai di sebuah aplikasi untuk membuat XML Http Requests.<\/p>\n<ul>\n<li>\n<h3><strong>Filter<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Pilihan item pada array yang dapat diterapkan serta menghasilkan array baru.<\/p>\n<ul>\n<li>\n<h3><strong>Directive atau Arahan<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Directives membuat sebuah elemen DOM (seperti elemen, atribut, css, dll). Ini dapat digunakan untuk membuat kustom tag HTML yang berfungsi sebagai widget baru, kustom. AngularJS memiliki Directives seperti (ngBind, ngModel&#8230;).<\/p>\n<ul>\n<li>\n<h3><strong>Template<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Tampilan yang diberikan dengan informasi dari controller dan model. ini dapat membuat beberapa view dalam satu halaman menggunakan &#8220;partials&#8221; atau file tunggal seperti <strong>(index.html)<\/strong>.<\/p>\n<ul>\n<li>\n<h3><strong>Routing<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Proses perpindahan tampilan atau switching.<\/p>\n<ul>\n<li>\n<h3><strong>Model View Whatever<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">MVC adalah pola desain untuk membagi aplikasi menjadi bagian yang berbeda (disebut Model, view dan Controller). Pembagian kerja serta memiliki tanggung jawab masing-masing yang akan memudahkan proses kerja. Dengan menerapkan pembagian kerja berupa Model, Controller dan View (MCV) serta ke metode lebih dekat menjadi MVVM (Model-View-Viewmodel).<\/p>\n<ul>\n<li>\n<h3><strong>Deep Linking<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Pemberian izin untuk melakukan encode aplikasi dalam URL dan dapat dilakukan bookmark yang mampu melakukan restore pada kondisi terakhir pada URL.<\/p>\n<ul>\n<li>\n<h3><strong>Dependency Injection<\/strong><\/h3>\n<\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">AngularJS memiliki ketergantungan injeksi sehingga memudahkan seorang developer dalam melakukan uji coba serta mengembangkan aplikasi atau website.<\/p>\n<h1><strong>Konsep AngularJS<\/strong><\/h1>\n<p>Diagram berikut ini menggambarkan beberapa bagian penting dari AngularJS yang akan dibahas secara rinci dalam bab-bab berikutnya.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-5865 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/Konsep-Angular-JS.jpg\" alt=\"\" width=\"588\" height=\"463\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/Konsep-Angular-JS.jpg 588w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/Konsep-Angular-JS-555x437.jpg 555w\" sizes=\"auto, (max-width: 588px) 100vw, 588px\" \/><\/p>\n<h1><strong>Fungsi AngularJS<\/strong><\/h1>\n<p>Fungsi yang dimiliki oleh AngularJS adalah dengan menjadi sebuah framework yang diterapkan pada website, dengan menggunakan kode dari JavaScript. Memiliki banyak fungsi untuk melakukan pengembangan, pembuatan, serta maintain dari website tersebut.<\/p>\n<p>Kemudahan dalam pengelolaan yang membantu pekerjaan developer dengan mudah mengelola website. Oleh karena dalam penerapannya juga secara bebas dan gratis yang akan memudahkan siapapun yang ingin mengelola website mudah menerapkan ke dalam website.<\/p>\n<h1><strong>Kelebihan AngularJS<\/strong><\/h1>\n<p>Berikut ini adalah beberapa kelebihan AngularJS, yaitu :<\/p>\n<ol>\n<li>Memudahkan developer untuk melakukan pembuatan aplikasi karena mampu melakukan pengelolaan Single Page Application secara mudah.<\/li>\n<li>Tingkat interaksi dengan HTML tinggi karena memiliki kemampuan melakukan data binding pada HTML.<\/li>\n<li>Memiliki sifat Dependency Injection yang membantu pekerjaan developer dalam melakukan penulisan komponen atau kode yang terpisah satu sama lain.<\/li>\n<li>Kemudahan dalam melakukan pembuatan kode sehingga menghasilkan cara yang lebih singkat dan efisien.<\/li>\n<\/ol>\n<h1><strong>Kekurangan AngularJS<\/strong><\/h1>\n<p>Berikut ini adalah beberapa kelemahan AngularJS, yaitu :<\/p>\n<ol>\n<li>Keamanan kurang, sehingga keamanan harus terus menerus dijaga. Terutama pada server dan autentifikasi aplikasi atau website.<\/li>\n<li>Tingkat ketergantungan dengan web browser tinggi, hal ini disebabkan karena pada web browser.<\/li>\n<\/ol>\n<h1><strong>Cara Penggunaan AngularJS<\/strong><\/h1>\n<h3><strong>1. Menginstall AngularJS<\/strong><\/h3>\n<p>Download di\u00a0<a href=\"https:\/\/angularjs.org\/\">https:\/\/angularjs.org\/<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-5875 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/download-angularjs.png\" alt=\"\" width=\"1230\" height=\"396\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/download-angularjs.png 1230w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/download-angularjs-1024x330.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/download-angularjs-768x247.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/download-angularjs-555x179.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/download-angularjs-1110x357.png 1110w\" sizes=\"auto, (max-width: 1230px) 100vw, 1230px\" \/><\/p>\n<h3><strong>2. Menambahkan script pada web page<\/strong><\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-5876 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/Menambahkan-script-pada-web-page.png\" alt=\"\" width=\"640\" height=\"99\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/Menambahkan-script-pada-web-page.png 640w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/Menambahkan-script-pada-web-page-555x86.png 555w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<p>AngularJS mencoba untuk meminimalkan ketidaksesuaian impedansi antara dokumen HTML centric dan apa yang dibutuhkan oleh sebuah aplikasi dengan membuat konstruksi HTML baru. AngularJS mengajarkan browser sintaks baru melalui konstruk yang sering disebut arahan. Contohnya termasuk :<\/p>\n<ol>\n<li>Pengikatan data, seperti pada {{}}.<\/li>\n<li>Struktur kontrol DOM untuk mengulang, menunjukkan dan menyembunyikan fragmen DOM.<\/li>\n<li>Dukungan untuk formulir dan validasi formulir.<\/li>\n<li>Melampirkan perilaku baru ke elemen DOM, seperti penanganan acara DOM.<\/li>\n<li>Pengelompokan HTML menjadi komponen yang dapat digunakan kembali.<\/li>\n<\/ol>\n<h1><strong>Cara kerja AngularJS<\/strong><\/h1>\n<p>Saat halaman terbuka di browser, berikut hal-hal terjadi :<\/p>\n<ol>\n<li>Dokumen HTML dimuat ke browser dan dievaluasi oleh browser. File AngularJS JavaScript melakukan load, obyek angular global akan dibuat. Selanjutnya, JavaScript yang mendaftarkan fungsi controller untuk menjalankannya.<\/li>\n<li>Berikutnya\u00a0<b>AngularJS\u00a0<\/b>akan melakukan scan melalui\u00a0<b>HTML\u00a0<\/b>untuk mencari aplikasi <b>AngularJS\u00a0<\/b>dan view. Setelah view ini terletak, ini menghubungkan view ke fungsi controller yang sesuai.<\/li>\n<li><b>AngularJS\u00a0<\/b>mengeksekusi fungsi controller. Kemudian menjadikan view dengan data dari model dipunyai oleh controller. Halaman ini sekarang siap untuk menampilkan hasil.<\/li>\n<\/ol>\n<h1><strong><span id=\"Bootstrap\" class=\"mw-headline\">Bootstrap AngularJS<\/span><\/strong><\/h1>\n<p>Tugas yang dilakukan oleh bootstrapper \u00a0AngularJS\u00a0terjadi dalam tiga fase setelah DOM dimuat :<\/p>\n<ol>\n<li>Pembuatan Injector baru.<\/li>\n<li>Kompilasi arahan yang menghiasi DOM.<\/li>\n<li>Menautkan semua arahan ke ruang lingkup.<\/li>\n<\/ol>\n<p>Arahan AngularJS memungkinkan pengembang untuk menentukan elemen dan atribut seperti HTML khusus dan dapat digunakan kembali yang menentukan pengikatan data dan perilaku komponen presentasi.\u00a0Beberapa arahan yang paling umum digunakan adalah :<\/p>\n<p><strong>1.<\/strong> <span style=\"color: #000000;\"><strong>ng-animate<\/strong><\/span><\/p>\n<p>Sebuah modul memberikan dukungan untuk pengait animasi JavaScript, transisi CSS3 dan animasi keyframe CSS3 dalam arahan inti dan kustom yang ada. Karena <span style=\"color: #008000;\"><strong>ng-*<\/strong><\/span> atribut tidak valid dalam spesifikasi HTML, <span style=\"color: #008000;\"><strong>data ng-*<\/strong><\/span> juga dapat digunakan sebagai awalan.\u00a0Misalnya, keduanya <span style=\"color: #008000;\"><strong>ng-app<\/strong><\/span> dan <span style=\"color: #008000;\"><strong>data-ng-app<\/strong><\/span> valid di AngularJS.<\/p>\n<p><strong>2.<\/strong> <span style=\"color: #000000;\"><strong>ng-app<\/strong><\/span><\/p>\n<p>Mendeklarasikan elemen root dari aplikasi AngularJS, di mana direktif dapat digunakan untuk mendeklarasikan binding dan menentukan perilaku.<\/p>\n<p><strong>3.<\/strong> <span style=\"color: #000000;\"><strong>ng-aria<\/strong><\/span><\/p>\n<p>Modul untuk dukungan aksesibilitas atribut ARIA umum.<\/p>\n<p><strong>4.<\/strong> <span style=\"color: #000000;\"><strong>ng-bind<\/strong><\/span><\/p>\n<p>Menyetel teks elemen DOM ke nilai ekspresi.\u00a0Misalnya, <span style=\"color: #008000;\"><strong>&lt;span ng-blind=&#8221;name&#8221;&gt;&lt;\/span&gt; <\/strong><\/span>menampilkan nilai &#8220;name&#8221; di dalam elemen span. Setiap perubahan pada variabel &#8216;nama&#8217; dalam cakupan aplikasi langsung terlihat di DOM.<\/p>\n<p><strong>5.<\/strong> <span style=\"color: #000000;\"><strong>ng-class<\/strong><\/span><\/p>\n<p>Menerapkan kelas secara bersyarat, bergantung pada nilai ekspresi boolean.<\/p>\n<p><strong>6.<\/strong> <span style=\"color: #000000;\"><strong>ng-controller<\/strong><\/span><\/p>\n<p>Menentukan kelas pengontrol JavaScript yang mengevaluasi ekspresi HTML.<\/p>\n<p><strong>7.<\/strong> <span style=\"color: #000000;\"><strong>ng-if<\/strong><\/span><\/p>\n<p>Dasar pernyataan if direktif yang memberi contoh elemen berikut jika kondisinya benar.\u00a0Jika kondisinya salah, elemen tersebut dihapus dari DOM.\u00a0Jika benar, tiruan dari elemen yang dikompilasi akan dimasukkan kembali.<\/p>\n<p><strong>8.<\/strong> <span style=\"color: #000000;\"><strong>ng-init<\/strong><\/span><\/p>\n<p>Dipanggil sekali saat elemen di inisialisasi.<\/p>\n<p><strong>9.<\/strong> <span style=\"color: #000000;\"><strong>ng-model<\/strong><\/span><\/p>\n<p>Mirip dengan <strong><span style=\"color: #008000;\">ng-bind<\/span><\/strong>, tetapi menetapkan pengikatan data dua arah antara tampilan dan cakupan.<\/p>\n<p><strong>10.<\/strong> <span style=\"color: #000000;\"><strong>ng-model-options<\/strong><\/span><\/p>\n<p>Menyediakan tuning tentang bagaimana pembaruan model dilakukan.<\/p>\n<p><strong>11.<\/strong> <span style=\"color: #000000;\"><strong>ng-repeat<\/strong><\/span><\/p>\n<p>Membuat instance elemen satu kali per item dari koleksi.<\/p>\n<p><strong>12.<\/strong> <span style=\"color: #000000;\"><strong>ng-show <\/strong>&amp; <strong>ng-hide<\/strong><\/span><\/p>\n<p>Menampilkan atau menyembunyikan elemen secara bersyarat, bergantung pada nilai ekspresi boolean.\u00a0Tampilkan dan sembunyikan dicapai dengan mengatur gaya tampilan CSS.<\/p>\n<p><strong>13.<\/strong> <span style=\"color: #000000;\"><strong>ng-switch<\/strong><\/span><\/p>\n<p>Membuat instance secara bersyarat dari satu tempat dari sekumpulan pilihan, bergantung pada nilai ekspresi pemilihan.<\/p>\n<p><strong>14.<\/strong> <span style=\"color: #000000;\"><strong>ng-view<\/strong><\/span><\/p>\n<p>Direktif dasar bertanggung jawab untuk menangani rute Direktif dasar bertanggung jawab untuk menangani rute.<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-right kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;right&quot;,&quot;id&quot;:&quot;5864&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;2&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;5&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;0&quot;,&quot;greet&quot;:&quot;Jadilah yang pertama untuk memberi nilai&quot;,&quot;legend&quot;:&quot;5\\\/5 - (2 votes)&quot;,&quot;size&quot;:&quot;22&quot;,&quot;title&quot;:&quot;Mengenal tentang AngularJS&quot;,&quot;width&quot;:&quot;110&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} - ({count} {votes})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 110px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 17.6px;\">\n            5\/5 - (2 votes)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Pengertian AngularJS AngularJS merupakan salah satu jenis framework dari JavaScript yang menggunakan metode MVC (Model View Controller) dan saat ini dikelola oleh Google. Dimana metode MVC tersebut memiliki fungsi sebagai metode yang dapat memudahkan aplikasi untuk dikembangkan serta dilakukan pembersihan. AngularJS awal di kembangkan tahun 2009 oleh Misko Hevery dan Adam Abrons. AngularJS juga dapat [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":5878,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rop_custom_images_group":[],"rop_custom_messages_group":[],"rop_publish_now":"initial","rop_publish_now_accounts":{"twitter_2392824914_2392824914":""},"rop_publish_now_history":[],"rop_publish_now_status":"pending","_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"enabled":false},"version":2}},"categories":[3],"tags":[1943,1951,1950,1944,1945,1947,1949,1948,1946],"class_list":["post-5864","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-angularjs-adalah","tag-cara-kerja-angularjs","tag-cara-menggunakan-angularjs","tag-fitur-angularjs","tag-fitur-utama-angularjs","tag-fungsi-angularjs","tag-kekurangan-angularjs","tag-kelebihan-angularjs","tag-konsep-angularjs"],"featured_image_src":{"landsacpe":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS-1110x669.png",738,445,true],"list":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS-555x335.png",463,279,true],"medium":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS-300x181.png",300,181,true],"full":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png",1828,1102,false]},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Mengenal tentang AngularJS - Hosteko Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mengenal tentang AngularJS - Hosteko Blog\" \/>\n<meta property=\"og:description\" content=\"Pengertian AngularJS AngularJS merupakan salah satu jenis framework dari JavaScript yang menggunakan metode MVC (Model View Controller) dan saat ini dikelola oleh Google. Dimana metode MVC tersebut memiliki fungsi sebagai metode yang dapat memudahkan aplikasi untuk dikembangkan serta dilakukan pembersihan. AngularJS awal di kembangkan tahun 2009 oleh Misko Hevery dan Adam Abrons. AngularJS juga dapat [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\" \/>\n<meta property=\"og:site_name\" content=\"Hosteko Blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-10-09T09:11:20+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-10-17T01:05:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1828\" \/>\n\t<meta property=\"og:image:height\" content=\"1102\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Risa Y\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Risa Y\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#article\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\"},\"author\":{\"name\":\"Risa Y\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b\"},\"headline\":\"Mengenal tentang AngularJS\",\"datePublished\":\"2020-10-09T09:11:20+00:00\",\"dateModified\":\"2020-10-17T01:05:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\"},\"wordCount\":1372,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png\",\"keywords\":[\"angularjs adalah\",\"cara kerja angularjs\",\"cara menggunakan angularjs\",\"fitur angularjs\",\"fitur utama angularjs\",\"fungsi angularjs\",\"kekurangan angularjs\",\"kelebihan angularjs\",\"konsep angularjs\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\",\"url\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\",\"name\":\"Mengenal tentang AngularJS - Hosteko Blog\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png\",\"datePublished\":\"2020-10-09T09:11:20+00:00\",\"dateModified\":\"2020-10-17T01:05:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png\",\"width\":1828,\"height\":1102},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/hosteko.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mengenal tentang AngularJS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/hosteko.com\/blog\/#website\",\"url\":\"https:\/\/hosteko.com\/blog\/\",\"name\":\"Hosteko Blog\",\"description\":\"Berita &amp; Informasi Dunia IT\",\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/hosteko.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\",\"name\":\"HOSTEKO\",\"url\":\"https:\/\/hosteko.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png\",\"width\":195,\"height\":57,\"caption\":\"HOSTEKO\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b\",\"name\":\"Risa Y\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g\",\"caption\":\"Risa Y\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mengenal tentang AngularJS - Hosteko Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs","og_locale":"en_US","og_type":"article","og_title":"Mengenal tentang AngularJS - Hosteko Blog","og_description":"Pengertian AngularJS AngularJS merupakan salah satu jenis framework dari JavaScript yang menggunakan metode MVC (Model View Controller) dan saat ini dikelola oleh Google. Dimana metode MVC tersebut memiliki fungsi sebagai metode yang dapat memudahkan aplikasi untuk dikembangkan serta dilakukan pembersihan. AngularJS awal di kembangkan tahun 2009 oleh Misko Hevery dan Adam Abrons. AngularJS juga dapat [&hellip;]","og_url":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs","og_site_name":"Hosteko Blog","article_published_time":"2020-10-09T09:11:20+00:00","article_modified_time":"2020-10-17T01:05:00+00:00","og_image":[{"width":1828,"height":1102,"url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png","type":"image\/png"}],"author":"Risa Y","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Risa Y","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#article","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs"},"author":{"name":"Risa Y","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b"},"headline":"Mengenal tentang AngularJS","datePublished":"2020-10-09T09:11:20+00:00","dateModified":"2020-10-17T01:05:00+00:00","mainEntityOfPage":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs"},"wordCount":1372,"commentCount":0,"publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"image":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png","keywords":["angularjs adalah","cara kerja angularjs","cara menggunakan angularjs","fitur angularjs","fitur utama angularjs","fungsi angularjs","kekurangan angularjs","kelebihan angularjs","konsep angularjs"],"articleSection":["Blog"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#respond"]}]},{"@type":"WebPage","@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs","url":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs","name":"Mengenal tentang AngularJS - Hosteko Blog","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage"},"image":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png","datePublished":"2020-10-09T09:11:20+00:00","dateModified":"2020-10-17T01:05:00+00:00","breadcrumb":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#primaryimage","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png","width":1828,"height":1102},{"@type":"BreadcrumbList","@id":"https:\/\/hosteko.com\/blog\/mengenal-tentang-angularjs#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/hosteko.com\/blog"},{"@type":"ListItem","position":2,"name":"Mengenal tentang AngularJS"}]},{"@type":"WebSite","@id":"https:\/\/hosteko.com\/blog\/#website","url":"https:\/\/hosteko.com\/blog\/","name":"Hosteko Blog","description":"Berita &amp; Informasi Dunia IT","publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/hosteko.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/hosteko.com\/blog\/#organization","name":"HOSTEKO","url":"https:\/\/hosteko.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png","width":195,"height":57,"caption":"HOSTEKO"},"image":{"@id":"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b","name":"Risa Y","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g","caption":"Risa Y"}}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/10\/ANGULARJS.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/5864","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/comments?post=5864"}],"version-history":[{"count":0,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/5864\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media\/5878"}],"wp:attachment":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media?parent=5864"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/categories?post=5864"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/tags?post=5864"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}