Hey guys, I just get a blank page and no errors. Any hint for me?
Thanks for your help!
customersCtrl.js
(function() {
var app = angular.module('customersApp', []);
app.controller('CustomersCtrl', ['$scope', function ($scope) {
$scope.sortBy = 'name';
$scope.reverse = false;
$scope.customers= [
{
joined: '2000-12-02',
name: 'John',
city: 'Chandler',
orderTotal: 9.9956,
order: [
{
id: 1,
product: 'Shoes',
total: 9.9956
}
]
},
{
joined: '2012-12-20',
name: 'John',
city: 'Chandler',
orderTotal: 19.9956,
order: [
{
id: 2,
product: 'Pants',
total: 19.9956
},
{
id: 3,
product: 'Socks',
total: 0.9956
}
]
},
{
joined: '2000-05-06',
name: 'John',
city: 'Chandler',
orderTotal: 90.9956,
order: [
{
id: 4,
product: 'Shirts',
total: 90.9956
}
]
}
];
// Sortiert die Spalten der Tabelle auf- / absteigend
$scope.doSort = function(propName) {
$scope.sortBy = propName;
$scope.reverse = !$scope.reverse;
};
}]);
}());
app.js
(function() {
var app = angular.module('customersApp', ['ngRoute']);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
controller: 'CustomersCtrl',
templateUrl: 'app/views/customers.html'
})
.when('/orders/:customerId', {
controller: 'OrdersCtrl',
templateUrl: 'app/views/orders.html'
})
.otherwise({ redirectTo: '/' });
});
}());
customers.html
<h2>Customers</h2>
Filter: <input type="text" ng-model="customerFilter.name">
<br><br>
<table>
<tr>
<th ng-click="doSort('name')">Name</th>
<th ng-click="doSort('city')">City</th>
<th ng-click="doSort('orderTotal')">Order Total</th>
<th ng-click="doSort('joined')">Joined</th>
<th> </th>
</tr>
<tr ng-repeat="cust in customers | filter:customerFilter | orderBy:sortBy:reverse">
<td>{{ cust.name | uppercase }}</td>
<td>{{ cust.city | lowercase }}</td>
<td>{{ cust.orderTotal | currency }}</td>
<td>{{ cust.joined | date }}</td>
<td><a href="#/orders/{{ cust.id }}">View Orders</a></td>
</tr>
</table>
<br>
<span>Total customers: {{ customers.length }} </span>
index.html
<!doctype html>
<html ng-app="customersApp">
<head>
<title>AngularJS</title>
<link href="css/style.css" type="text/css">
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
</head>
<body>
<ng-view></ng-view>
<!-- AngularJS -->
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<!-- Modules -->
<script src="app/app.js"></script>
<!-- Controllers -->
<script src="app/controllers/customersController.js"></script>
<script src="app/controllers/ordersController.js"></script>
<!-- Localization -->
<script src="i18n/angular-locale_de-de.js"></script>
</body>
</html>