ng-table没有显示来自http get的数据

时间:2015-02-20 18:14:29

标签: javascript ruby-on-rails angularjs ngtable

我正在尝试用带有angularjs和rails的ajax数据创建一个ng-table。 我看到http get成功获取数据但由于某种原因我不会将其附加到我的表中,它总是显示没有记录。 这是我的代码。 谢谢

(function(){
  var app = angular.module("apTags", ["ngTable"]);

  app.controller("apTagsController", function($scope, $timeout, $http, ngTableParams){
    $http.get('/owners/ap_tags/ap_tags_json.json')
    .success(function(data, status) {
      $scope.tags = data;

      $scope.tableParams = new ngTableParams({
          page: 1,            // show first page
          count: 10,           // count per page
          sorting: {name:'asc'}
      }, {
          total: $scope.tags.length, // length of data
          getData: function($defer, params) {
             var orderedData = $scope.tags;
            $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
            
          }
      });
    });
  });
})();
<div class="container" ng-app="apTags">
  <div ng-controller="apTagsController as list">
    <p><strong>Page:</strong> {{tableParams.page()}}</p>
    <p><strong>Count per page:</strong> {{tableParams.count()}}</p>
    <p>Filter: <input class="form-control" type="text" ng-model="filter.$" /></p>
    <table ng-table="tableParams" id="table_tags" class="table table-condensed table-bordered table-hover">
      <thead>
        <tr>
          <th>Tag</th>
          <th>Share</th>
          <th>Direct Product Count</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="tag in list.tags">
          <td >{{tag.name}}</td>
          <td >{{tag.share}}%</td>
          <td ></td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

和我的rails控制器

class Owners::ApTagsController < WlApplicationController
  respond_to :json, only: [:ap_tags_json]
  def index
    respond_to do |format|
      format.json do
        @tags = ApTag.all
        render :json => @tags.map(&:attributes)
      end
      format.html
    end
  end

  def ap_tags_json
    data = ApTag.all
    respond_with(data) do |format|
      format.json { render :json => data.map(&:attributes).as_json }
    end
  end
end

2 个答案:

答案 0 :(得分:0)

在HTTP GET请求的成功功能中,您将响应数据设置为$scope.tags

然后在您的HTML中,当您迭代它时,您有ng-repeat="tag in list.tags。将tags附加到list对象($scope.list = {}; $scope.list.tags = data;)。

或者,迭代HTML中的正确数据:ng-repeat="tag in tags"

答案 1 :(得分:0)

使用ng-table时,你应该迭代$ data而不是list.tags。此问题涵盖了更多详细信息:ng-table sorting not working