工厂不显示json数据angularjs

Question

我似乎无法显示我工厂的任何 JSON 数据。我很确定contractors.json 文件加载正确，因为控制台几次抱怨它的语法。我的 grunt watch 没有给我任何错误，控制台也没有。我是 Angular 的新手，我不确定出了什么问题。

  'use strict';

angular.module('angularPlainApp', [ 'ngCookies', 'ngResource', 'ngSanitize', 'ngRoute' ])

  .config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  })

  .controller('MainCtrl', function ($scope, dataList) {
    $scope.contractors = dataList.getList();

    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
  })

  .factory('dataList', function($http, $q) {
    return {
      getList: function() {
        var deferred = $q.defer();
        $http.get('scripts/contractors.json').success(function(data){
          deferred.resolve(data);
        }).error(function(){
          return deferred.promise;
        });
      },
    };
  });

我将我的 app.js 置于所有不同类型的设置中，并且从未显示任何数据，与 html sn-p 相同。

<aside class= "contractors">
    <ul class= "contractors-list" ng-controller="MainCtrl" >
    <li ng-repeat = "contractor in contractors">
            <div class="headshot-wrapper">
                <img src='path/to/img.img'>
            </div>
            <div class="contractor-summary-info">
            <h3>{{ contractors.name }}</h3>
            <h4 class="summary-subhead">{{ contractors.position }}</h4>
                <p>{{ contractors.number }}</p>
                <p>{{ contractors.jobFunction }}</p>
            </div>
        </li>
    </ul><!--.contractor-summary-->
    </aside><!--contractor-list-->

没有显示来自我的外部承包商.json 文件的信息。

我正在使用 bower、yeoman 和 gruntjs。非常感谢任何提示、技巧或一般输入。 提前感谢！

Answer 1

你没有兑现承诺：

var deferred = $q.defer();
    $http.get('scripts/contractors.json').success(function(data){
      deferred.resolve(data);
    }).error(function(){
      //
      // !!!! here is your mistake! 
      // You only return the promis if an error occured.
      // 
      return deferred.promise;
    });

试试这个方法：

var deferred = $q.defer();
$http.get('scripts/contractors.json').success(function(data){
    deferred.resolve(data);
}).error(function(){
   deferred.reject();
});
return deferred.promise;