Не удалось перезагрузить данные ng-repeat, что я сделал не так?

Я люблю перезагрузитьng-repeat элемент после того, как я обработал некоторые данные, но это не удалось. Мне нравится знать, что я сделал не так.

Итак, общий идентификатор процесса: я загружаю некоторые данные из «iframe.php», а затем вставляю данные в невидимый тег div для jquery, чтобы отобразить данные (в формате html) в формат json и сохранить данные json в переменную с именемtableObject, И тогда я буду использоватьscope.$apply(scope.showCards) вставить данные в мой$scope.cards.

Вот мой код:

var app = angular.module('rabbit', ['ngMaterial', 'ngMessages', 'ngMdIcons']),
    apiURL = 'iframe.php',
    tableObject = [];

$.ajax({
  url: "iframe.php",
  crossDomain: true,
  dataType: "html",
  success: function(data) {
    var json = data.substring(data.indexOf('<tr class = "pfrow2">') - 21);
    json = json.substring(0,json.indexOf('<td style="margin-top: 20px" colspan="2">'));
    json = json.substring(0,json.lastIndexOf('</td>') + 5);
    function widthChange() {
      if (json.indexOf('&width=130') != -1) {
        json = json.replace('&width=130','&width=300');
        widthChange();
      } else {
        // console.log(json);
        $('#json').html(json);
        var headers = ["name","kind","type","age","size","thumb","link"];
        tableObject = $("#json tr").map(function(i){
          var row = {};
          $(this).find('td').each(function(i){
            var rowName = headers[i];
            row[rowName] = $(this).text().trim();
          });
          $(this).find('td.legacy img').each(function(){
            var rowName = headers[5];
            row[rowName] = $(this).attr('src');
          });
          $(this).find('td.legacy a').each(function(){
            var rowName = headers[6];
            row[rowName] = $(this).attr('href');
          });
          return row;
        }).get();
        console.table(tableObject);
        $('#json').html('');
        var scope = angular.element($('#content')).scope();
        scope.$apply(scope.showCards);
      }
    }
    widthChange();
  },
  error: function() {
    console.log('error');
  },
});

app.controller('cardCtrl', function ($scope, $log, $mdDialog) {
  var showCards = function() {
    $scope.cards.push(tableObject);
  };
  $scope.cards = tableObject;
});

Здесьng-repeat элемент в HTML:

  <div id="content" layout-sm="col" layout="row" layout-wrap ng-controller="cardCtrl">
    <md-card ng-repeat="card in cards" class="noselect" md-ink-ripple>
      <img src="{{card.thumb}}" alt="{{card.name}}">
      <h2>{{card.name}}</h2>
      <p>{{card.type}}</p>
      <p>{{card.age}}</p>
      <p>{{card.size}}</p>
      <a href="{{card.link}}"></a>
    </md-card>
  </div>

Ответы на вопрос(1)

Ваш ответ на вопрос