Angularjs нг-таблица не показывает данные о возврате к листингу

Question

Я использую AngularJS 1.2.10 стабильный с проектом Rails, и я пытаюсь заставить ng-таблицу работать с моими данными, и ничего не появляется.

Я включил файлы таблицы ng и включил его в свой угловой модуль. Я получаю данные, когда обновляю страницу, но если я ухожу от этого представления, то снова в одностраничном приложении не загружаются данные. то есть: обновить браузер в списке и все данные там, я иду, чтобы просмотреть отдельный элемент, и я перехожу на новую страницу (через маршрутизацию angularJS), затем я возвращаюсь в список (через маршрутизацию angularJS снова) и данные пустые / нет списка.

Вот мой стол

<table ng-table="tableParams" class="table">
  <tr ng-repeat="debtor in debtors">
    <td data-title="'Code'" sortable="'code'">{{debtor.code}}</td>
    <td data-title="'Name'" sortable="'name'">{{debtor.name}}</td>
    <td>
      <a href="/api#/clients/{{debtor.id}}">Show</a>
      <a href="/api#/clients/{{debtor.id}}/edit">Edit</a>
      <a href="" ng-confirm-click="destroy(debtor.id)">Delete</a>
    </td>
  </tr>
</table>

Вот мой контроллер, где я получаю свои данные.

app.controller "DebtorsController", ['$window', '$scope', '$http', '$location', '$state', '$stateParams', '$modal', '$timeout', 'flash', 'Common', 'Debtor', 'Client', 'ngTableParams', '$filter', ($window, $scope, $http, $location, $state, $stateParams, $modal, $timeout, flash, Common, Debtor, Client, ngTableParams, $filter) ->

  # --------------------------------------------------------------------------------
  # Initialise
  # --------------------------------------------------------------------------------
  $scope.debtors = {}

  # --------------------------------------------------------------------------------
  # Index
  # --------------------------------------------------------------------------------
  if $state.current.name == "debtors"
    Debtor.query {},
      (data) ->
        # Define ng-table params
        $scope.tableParams = new ngTableParams({
          page: 1,
          total: data.length,
          count: 10
        })

  # --------------------------------------------------------------------------------
  # Index
  # --------------------------------------------------------------------------------
  if $state.current.name == "debtors"
    $data = []
    Debtor.query {}, (response) -> $data = response
    console.log "debtors index"

    $scope.tableParams = new ngTableParams({
      page: 1,
      count: 10,
      sorting: { name: 'asc'}
    }, {
      total: $data.length,
      getData: ($defer, params) ->
        console.log "run deferred"
        orderedData = (if params.sorting then $filter('orderBy')($data, params.orderBy()) else $data)
        $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()))
    })

Я вижу в консоли chromes, что он вызывает

XHR finished loading: "http://localhost:3000/assets/layouts/default.html.erb". angular-min.js?body=1:1825
XHR finished loading: "http://localhost:3000/assets/debtors/index.html.erb". angular-min.js?body=1:1825

debtors index  

ngTable: set settings 
Object {$scope: null, $loading: false, data: null, total: 0, counts: Array[4]…}
 angular-min.js?body=1:2147
ngTable: set parameters 
Object {page: 1, count: 10, filter: Object, sorting: Object, group: Object…}
 angular-min.js?body=1:2147
XHR finished loading: "http://localhost:3000/debtors". angular-min.js?body=1:1825
XHR finished loading: "http://localhost:3000/assets/debtors/_listing.html.erb". angular-min.js?body=1:1825
ngTable: reload data angular-min.js?body=1:2147
ngTable: current scope 
$get.h.$new.a {$id: "006", this: $get.h.$new.a, $$listeners: Object, $$listenerCount: Object, $parent: $get.h.$new.a…}
 angular-min.js?body=1:2147

run deferred

ngTable: reload data angular-min.js?body=1:2147
ngTable: current scope 
$get.h.$new.a {$id: "006", this: $get.h.$new.a, $$listeners: Object, $$listenerCount: Object, $parent: $get.h.$new.a…}
 angular-min.js?body=1:2147

(I clicked on 'show' for one of the items)

XHR finished loading: "http://localhost:3000/assets/clients/show.html.erb". angular-min.js?body=1:1825
XHR finished loading: "http://localhost:3000/clients/2". angular-min.js?body=1:1825
XHR finished loading: "http://localhost:3000/locations.json". angular-min.js?body=1:1825

(I clicked on 'listing' which takes me back to the debtors listing)

debtors index

ngTable: set settings 
Object {$scope: null, $loading: false, data: null, total: 0, counts: Array[4]…}
 angular-min.js?body=1:2147
ngTable: set parameters 
Object {page: 1, count: 10, filter: Object, sorting: Object, group: Object…}
 angular-min.js?body=1:2147
ngTable: reload data angular-min.js?body=1:2147
ngTable: current scope 
$get.h.$new.a {$id: "017", this: $get.h.$new.a, $$listeners: Object, $$listenerCount: Object, $parent: $get.h.$new.a…}
 angular-min.js?body=1:2147

run deferred

ngTable: reload data angular-min.js?body=1:2147
ngTable: current scope 
$get.h.$new.a {$id: "017", this: $get.h.$new.a, $$listeners: Object, $$listenerCount: Object, $parent: $get.h.$new.a…}
 angular-min.js?body=1:2147
XHR finished loading: "http://localhost:3000/debtors". 

Возвращаясь к списку должников, он не вызывает эти две строки:

XHR finished loading: "http://localhost:3000/debtors". angular-min.js?body=1:1825
XHR finished loading: "http://localhost:3000/assets/debtors/_listing.html.erb". angular-

Я думаю, что это должно перезагрузить данные, не столько шаблон, хотя, как я это вижу.

Answer 1

Заметил, что мне нужно пойти и получить данные с частью getData ngTableParams и ждать, пока они успешно вернутся с моими данными, прежде чем применять фильтр и возвращать его для визуализации.

  # --------------------------------------------------------------------------------
  # Index
  # --------------------------------------------------------------------------------
  if $state.current.name == "debtors"

    # Setup ng-table with defaults and data
    $scope.tableParams = new ngTableParams({
      page: 1,
      count: 10,
      sorting: { name: 'asc'}
    }, {
      total: $data.length,
      # ng-table will ask for updated data, this is where it gets it from.
      getData: ($defer, params) ->
        Debtor.query {}, (response) ->
          $data = response
          console.log 'run deferred'
          orderedData = (if params.sorting then $filter('orderBy')($data, params.orderBy()) else $data)
          $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()))
    })