Editor

Pregled code-a:

<!DOCTYPE HTML>
<html lang="hr">
<head>
<meta charset="UTF-8">
<title>AngularJS - $route index file</title>
</head>
<body ng-app="mojApp">

Ovo je main layout za $route primjer.
<br>Dodatni fajlovi su:
<br>51route_popis.html
<br>
<hr>
Klikni na ovaj link kako bi se izlistalo prvih 5 ljudi iz popisa u 51route_popis.html:
<a href="51route_url_params.html#/popis/5">51route_url_params.html#/popis/5</a> .
<br>
Klikni na ovaj link kako bi se izlistalo prvih 3 ljudi iz popisa u 51route_popis.html:
<a href="51route_url_params.html#/popis/3">51route_url_params.html#/popis/3</a> .
<br>
<br>

<div ng-view></div>

<script src="../angularjs/1.2.9/angular.min.js"></script>
<script src="../angularjs/1.2.9/angular-route.min.js"></script>
<script>
    var mojModul = angular.module('mojApp', ['ngRoute']);
    
   //routes
    mojModul.config(['$routeProvider',
        function($routeProvider){
            $routeProvider.
            when('/popis/:lmt', {
                templateUrl: '51route_popis.html',
                controller: 'PopisCtrl'
            }).
            otherwise({
                redirectTo: '/'
            });
    }]);
    
    
    //controller definiran sa ng-controller u 51route_popis.html
    mojModul.controller('PopisCtrl', function($scope, $routeParams){
        //model
        $scope.niz_obj=[
            {ime:'Marko', godiste:1975}, //1. objekt
            {ime:'Janko', godiste:1998}, //2. objekt
            {ime:'Berta', godiste:1956}, //3. objekt
            {ime:'Zorko', godiste:1991},  //4. objekt
            {ime:'Ivan', godiste:2003},  //5. objekt
            {ime:'Pero', godiste:1932}  //6. objekt
        ];
        
        //definira lmt2 za 51route_popis.html
        $scope.lmt2 = $routeParams.lmt;
    });
    
</script>

</body>
</html>

Pregled stranice:

Pogledaj stranicu ../javascript/angularjs/primjeri/51route_url_params.html.