Angular Js’de Fonksiyon Çağrısı Yapma

Önceki blog yazımda ng-repeat direktifi kullanarak listeleme ile ilgili örnek göstermiştim. Örneği biraz daha geliştirerek listeye eleman ekleme, listeden eleman çıkarma işleri yapabilmek için fonksiyon çağırma ile ilgili örnek gösteriyor olacağım…

names ismindeki listeye eklemiş olduğum elemanları ng-repeat direktifi ile ekrana listeleme işlemi yapmıştık. Listenin altına bir textbox ve buton ekliyoruz. Textbox’a girilen değeri ng-model=”enteredName” şeklinde saklıyoruz ve ng-submit=”addName() direktifi ile AddName() ismindeki metodu çağıyoruz. Bu metodun yapacağı names ismindeki listeye eleman eklemek olacaktır. Bunu da

$scope.names.push($scope.enteredName);

Komutu ile yapar.

Diğer bir özellik, listeden eleman silme; bunu da listenin yanına bir link ekleyerek ng-click direktifi ile yine fonksiyon çağırarak yapıyoruz. ng-click=”removeName(name)” ile seçilen name parametresi ile removeName(name) çağırılır. Js tarafında ise aşağıdaki kodlar ile seçilen elemanın indexi bulunur ve listeden çıkarılır.

var i=$scope.names.indexOf(name);

$scope.names.splice(i,1);

Örneğin Html kodu aşağıdaki gibidir;