Editor

Pregled code-a:

<!DOCTYPE HTML>
<html lang="hr">
<head>
<meta charset="UTF-8">
<title>AngularJS - ng-repeat</title>

</head>
<body ng-app="mojApp">
Primjer pokazuje izlisatnje varijabli uz pomoć <b>ng-repeat</b> direktive.

<div ng-controller="MojCtrl">

<ol>
        <li ng-repeat="radnik in djelatnici">ime: {{radnik.ime}} &#160;&#160;&#160; godište: {{radnik.godiste}}</li>
    </ol>

ime: <input ng-model="novo_ime">
    <br>godiste: <input ng-model="novo_godiste">
    <br><button ng-click="dodaj()">Dodaj na kraj</button>
    <br><button ng-click="ukloni_zadnji()">Ukloni zadnji zapis</button>

</div>

<script src="../angularjs/1.2.9/angular.min.js"></script>
<script>
    var mojModul = angular.module('mojApp', []);
    
    mojModul.controller('MojCtrl', function($scope){
        
        $scope.djelatnici = [
            {ime: 'Perica' , godiste: 1955},
            {ime: 'Jovica' , godiste: 1932},
            {ime: 'Kata' , godiste: 2003}
        ];
        
        
        //metoda za dodavanje elemnta na kraj niza push()
        $scope.dodaj = function(){
           //ulazne varijable iz INPUTa
            var novo_ime = $scope.novo_ime;
            var novo_godiste = $scope.novo_godiste; 
            
            //dodavanje na kraj niza
            $scope.djelatnici.push({ime: novo_ime, godiste: novo_godiste}); //push dodaje novi clan na kraj niza
            
            //console.log(novo_ime);
        };
        
        //metoda za uklanjanje zadnjeg elementa niza pop()
        $scope.ukloni_zadnji = function(){
            $scope.djelatnici.pop();
        }
        
    });
</script>

</body>
</html>

Pregled stranice:

Pogledaj stranicu ../javascript/angularjs/primjeri/15ng-repeat_dodavanje.html.