-1
app.js //這是我的app.js文件我已經包括含HeaderCtrlModule它NG視工作不適合我的應用程序
var app = angular.module("BooKart",["ngRoute","HeaderCtrlModule"]);
app.config(function($routeProvider){
$routeProvider
.when("/books",{
templateUrl: "views/book-list.html",
controller: "BookListCtrl"
})
.when("/kart",{
templateUrl: "views/kart-list.html"
})
.otherwise({
redirectTo: "/books"
})
});
卡丁車-list.html //這個加載另一個文件卡丁車視圖
<div>
This is Kart view.
</div>
書list.html //加載了書目視圖
<div id="bookListWrapper">
<form role="form">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search here...">
</div>
</form>
<br/>
<ul class="list-unstyled">
<li class="book" ng-repeat="book in books"
style="background: white url('imgs/{{book.imgUrl}}') no-repeat">
<div class="book-details clearfix">
<h3>{{book.name}}</h3>
<p>{{book.price}}</p>
<ul class="list-unstyled list-inline">
<li>Rating: {{book.rating}}</li>
<li>Binding: {{book.binding}}</li>
<li>Publisher: {{book.publisher}}</li>
<li>Released: {{book.releaseDate}}</li>
</ul>
<p>{{book.details}}</p>
<button class="btn btn-info pull-right" ng-click="addToKart(book)">Add to
Kart</button>
</div>
</li>
</ul>
</div>
的index.html
個<!doctype html>
<html lang="en" ng-app="BooKart">
<head>
<meta charset="utf-8">
<title>Welcome to BooKart</title>
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" href="css/bootstrap.css">
<script src="lib/angular.js"></script>
<script src="lib/angular-route.min.js"></script>
<script src="js/controllers/app.js"></script>
<script src="js/controllers/HeaderCtrl.js"></script>
</head>
<body>
<div id="header-wrapper" ng-controller="HeaderCtrl">
<span class="logo pull-left">{{appDetails.title}}</span>
<span class="tagline pull-left">{{appDetails.tagline}}</span>
<div class="nav-wrapper pull-left">
<ul class="nav nav-pills">
<li class="active"><a href="#!/books">Books</a></li>
<li><a href="#!/kart">Kart</a></li>
</ul>
</div>
</div>
<div ng-view>
</div>
</body>
</html>
HeaderCtrl.js
angular.module("HeaderCtrlModule",[])
.controller("HeaderCtrl",["$scope",function($scope)
{
$scope.appDetails = {};
$scope.appDetails.title = "BooKart";
$scope.appDetails.tagline = "We have 1 Million Books for you";
}])
.controller("BookListCtrl",["$scope","$http",function($scope,$http){
{
$scope.books = [
{
imgUrl: "adultery.jpeg",
name: "Adultery",
price: 205,
rating: 4,
binding: "Paperback",
publisher: "Random House India",
releaseDate: "12-08-2014",
details: "Linda, in her thirties, begins to question the routine and
predictability of her days. In everybodys eyes, she has a perfect life-happy
marriage, children and a career. Yet what she feels is an eno... <a
href='#'>View More<a>"
},
{
imgUrl: "geronimo.jpeg",
name: "Geronimo Stilton Spacemice#2 : You're Mine, Captain!",
price: 168,
rating: 5,
binding: "Paperback",
publisher: "Scholastic",
releaseDate: "01-07-2014",
details: "Geronimo Stilton meets outer space in this cosmically fun
spin-off series!Meet Geronimo StiltonixHe is a spacemouse - the Geronimo
Stilton of a parallel universe! He is captain of the spaceship Mou... View
More"
},
{
imgUrl: "life-or-death.jpeg",
name: "Life or Death",
price: 339,
rating: 4,
binding: "Paperback",
publisher: "Hachette India",
releaseDate: "01-04-2014",
details: "Why would a man escape from prison the day before he's due
to be released? Audie Palmer has spent a decade in prison for an armed
robbery in which four people died, including two of his gang. Five... View
More"
},
{
imgUrl: "playing.jpeg",
name: "Playing It My Way : My Autobiography",
price: 599,
rating: 5,
binding: "Hardcover",
publisher: "Hodder & Stoughton",
releaseDate: "01-08-2014",
details: "I knew that if I agreed to write my story, I would have to
be completely honest, as thats the way I have always played the game and
that would mean talking about a number of things I have not addr... View
More"
},
{
imgUrl: "the-fault.jpeg",
name: "The Fault in Our Stars",
price: 227,
rating: 4.5,
binding: "Paperback",
publisher: "Penguin Books Ltd",
releaseDate: "25-01-2013",
details: "Despite the tumor-shrinking medical miracle that has
bought her a few years, Hazel has never been anything but terminal, her
final chapter inscribed upon diagnosis. But when a gorgeous plot twist n...
View More"
},
{
imgUrl: "wings-of-fire.jpeg",
name: "Wings of Fire: An Autobiography",
price: 124,
rating: 5,
binding: "Paperback",
publisher: "Universities Press",
releaseDate: "25-08-2000",
details: "Wings of Fire traces the life and times of India's former
president A.P.J. Abdul Kalam. It gives a glimpse of his childhood as well
as his growth as India's Missile Man. Summary of the Book Wings... View
More"
}
$scope.addToKart = function(book)
{
console.log("add to kart: ", book);
}
}]);
我認爲的代碼看起來很好我還包含＃！/＃寧/不知道爲什麼它不工作，請一定來看看告訴我什麼是錯誤。我是新來的角色，並沒有在控制檯中的錯誤，所以也沒有幫助。提前致謝。請幫我出
你是什麼問題在這裏？ –
該視圖不會更改 –
控制檯中的任何錯誤？ – anoop