Ciao sto facendo l'esercitazione su angularjs della guida di HTML.it
la prima parte mi funziona ma quando arrivo alle view multiple qui
http://www.html.it/articoli/angularj...t-di-google-4/
deve esserci qualche errore perchè le view non le vedo e vedo solo una pagina bianca percio ci deve essere qualvhe eroore nel javascript mi aiutate a capire qual è il problema?
questo è il javascript, ho messo tutto nello steso javascript file angularjs.js
codice:
var modulo = angular.module('photoApp', []);
modulo.config(function($routeProvider) {
$routeProvider.when('/photos',
{templateUrl: 'photo-list.html', controller: PhotoListCtrl});
$routeProvider.when('/photos/:id',
{templateUrl: 'photo-detail.html', controller: PhotoDetailCtrl});
$routeProvider.otherwise({redirectTo: '/photos'});
});
var photos = [ {"file": "1.jpg",
"description": "Palloncini colorati.",
"tags": "palloncini giallo rosso verde colori"},
{"file": "2.jpg",
"description": "Asso di cuori.",
"tags": "carte da gioco asso di cuori"},
{"file": "3.jpg",
"description": "L'orologiaio.",
"tags": "orologio orologiaio occhi"},
{"file": "4.jpg",
"description": "Asso di cuori.",
"tags": "carte da gioco asso di cuori"}
];
function PhotoDetailCtrl($scope, $routeParams) {
$scope.photo = photos[$routeParams.id - 1];
}
function PhotoListCtrl($scope) {
$scope.photos = [
{"file": "1.jpg", "description": "Palloncini colorati.",
"tags": "palloncini giallo rosso verde colori"},
{"file": "2.jpg", "description": "Asso di cuori.",
"tags": "carte da gioco asso di cuori"},
{"file": "3.jpg", "description": "L'orologiaio.",
"tags": "orologio orologiaio occhi"}
];
}
questo è l'html di index.html
codice HTML:
<!doctype html>
<html ng-app="photoApp">
<head>
<meta charset="utf-8">
<title>Catalogo fotografico</title>
<link rel="stylesheet" href="css/app.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script>
<script src="angularjs.js"></script>
</head>
<body>
<div ng-view>
</div>
</body>
</html>
e le 2 view sono queste photo-list.html
codice HTML:
<div>
Cerca: <input ng-model="query">
</div>
<ul>
<li ng-repeat="photo in photos | filter:query | orderBy:'description'">
<p>
<a href="#/photos/{{photo.id}}"><img ng-src="photos/thumb/{{photo.file}}" alt="{{photo.description}}" /></a>
{{photo.description}}
</p>
</li>
</ul>
e photo-detail.html
codice HTML:
<img ng-src="photos/{{ photo.file }}" alt="{{ photo.description}}">
<p>
<b>Descrizione</b>:<br/>
{{ photo.description}}
</p>
<p>
<b>Parole chiave</b>:<br>
{{ photo.tags}}
</p>
<a href="#/photos">Torna all'elenco delle foto</a>
vi ringrazio se mi aiutate