Cara Penggunaan Scope pada Angular JS part 2

Halo teman teman di panduan sebelumnya saya telah membahas mengenai Cara Penggunaan Scope pada Angular JS part 1, mengenai scope, di panduan kali ini saya akan membahas mengenai Cara Pemakaian Scope di Angular JS part 2, mengenai child scope.

Child Scope adalah sebuah prototype dari sebuah pembungkus atau parent, maksudnya yaitu  hasil yang ditampilkan sama dengan parent nya.

Baiklah teman teman biar lebih paham kita seketika saja masuk ke study casenya mengenai Cara Pemakaian Scope di Angular JS part 2 menggunakan child scope.

Langkah yang pertama-tama silahkan teman teman bikin sebuah folder yang Cara Pemakaian Scope di Angular JS part 2 didalam folder tersebut buatlah folder js dan di pada folder js bikin lah sebuah folder yang bernama controllers, didalam folder controller silahkan simpan script dibawah ini dengan nama MainController.js

app.controller('MainController',['$scope', function($scope){
  $scope.dumet=Source Code Aplikasi;
}]);

Langkah berikutnya di folder js silahkan bikin folder baru lagi yang bernama directive, di pada folder directive silahkan simpan script dibawah ini dengan nama directive.js

app.directive('myDirective',function(){
return {
scope : true,
restrict : 'EA',
tampilan : '<h2>Hello {{dunia}}</h2>',
replace : true,
link : function(scope,elem,attrs){
elem.bind('click',function(){
scope.dunia='Saya diklik';
scope.$digest();
});
}
};
});

Di file directive.js kita menambahkan sebuah property link yang berfungsi bagi menghubungkan file yang terdapat di directive.js dengan file yang berada di controller, karenanya ketika variable hello diklik yang berada scope di klik karenanya nilainya akan berubah menjadi saya di klik

Berikutnya kita akan membangun sebuah file yang bernama app.js yang disimpan didalam folder js dan silahkan simpan script dibawah ini di pada app.js tersebut

var app=angular.module('FirstApp',[]);

Bila telah silahkan simpan script dibawah ini dengan nama index.html yang berada di pada folder Cara Pemakaian Scope di Angular JS part 2, yang telah kita bikin sebelumnya.

Nah, kalau kita jalankan di browser karenanya hasilnya seperti dibawah ini,

• sebelum di klik

• setelah di klik

Oke teman teman lumayan skian panduan saya kali ini mengenai Cara Pemakaian Scope di Angular JS part 2, mengenai scope child

Semoga bermanfaat Terimakasih.

https://www.kursuswebsite.org/cara-pengunaan-scope-pada-angular-js-part-1/

Sumber https://kursuswebsite.org