angularjs $ http.get什么都没显示

Question

大家好，这是我第一次使用AngularJS。 这是我的AngularJS代码：

var app = angular.module('apps', []);
app.controller('foodsCtrl', function($scope, $http) {
    var url = 'http://localhost/angular/';
    $http.get( url + 'test.php').then(function(response) {

        var allFoods = response.data; // JSON data
        var countingFoods = Math.round( Object.keys(allFoods).length );

        $scope.foodPartOne = allFoods.slice(countingFoods / 2);
        $scope.foodPartTwo = allFoods.slice(0, countingFoods / 2);

    });
});

和 HTML代码：

<div ng-app="apps" ng-controller="foodsCtrl">
    <div data-ng-repeat="food in foodPartOne">
        <img src="uploads/{{ food.food_img }}" alt="{{ food.food_name }}" class="img-circle">
    </div>

    <div data-ng-repeat="food in foodPartTwo">
        <img src="uploads/{{ food.food_img }}" alt="{{ food.food_name }}" class="img-circle">
    </div>
</div>

在开发人员工具中，我看到“TypeError：dbg未定义”，我的页面为空白。