Reputation: 1870
There's something wrong when I'm trying to get json file with data into my ng-repeat.
Somehow, in the console appears 'All drinks loaded!'
which is success information, but it doesn't show in the DOM.
Also I'm receiving an error: angular.min.js:118 TypeError: $http.get(...).success(...).errors is not a function
If anybody knows what may causing that error, please tell me. Thanks for help.
var app = angular.module('app', []);
app.controller('MainController', ['$scope', '$http', '$log',
function($scope, $http, $log) {
$scope.drinks = [];
$http.get('drinks.json')
.success(function(data, status, headers, config) {
$scope.drinks = data;
$log.info('All drinks loaded!');
}).errors(function(data, status, headers, config) {
$log.error('Error' + status + 'unable to download drinks list.');
});
}
]);
//drinks.json
//[
//{
//"name": "Pepsi 1l",
//"price": 2.99
//},
//{
//"name": "Orange juice 0.5l",
//"price": 1.40
//},
//{
//"name": "Lemon tea 2l",
//"price": 3.20
//},
//{
//"name": "Cola-Cola 0.33l",
//"price": 0.89
//}
//]
<div class="container">
<div class="content" ng-controller="MainController">
<div class="col-md-6">
</div>
<div class="col-md-6">
<ul class="list-group">
<li class="list-group-item" ng-repeat="(id, product) in drinks">
<strong>{{ product.name }}</strong> - {{ product.price | currency }}
<button ng-click="removeFromCart(id)" class="btn btn-xs btn-danger pull-right">X</button>
</li>
</ul>
</div>
</div>
</div>
Upvotes: 1
Views: 35
Reputation: 16874
Its .error()
not .errors()
$http.get('url')
.success(function(data, status, headers, config) {
// do something
}).error(function(data, status, headers, config) {
// do something
});
Change it to fix the js error and your page will work fine
Upvotes: 1