Угловая JS: «Ошибка нечистоты: 10 $ digest() итераций достигнуто. Отмена! Наблюдатели уволили за последние 5 итераций»

Question

Я получил эту ошибку в своем проекте. Фактически, я применил разбиение на страницы с использованием фильтров в угловых Js, загружая таблицу с разбивкой по страницам, а также отображая ошибку в $ scope. $ Apply(), которая находится в MainController.

есть две ошибки в консоли,

один "Ошибка: 10 $ дайджеста() Итерации достигли Aborting!"

и другие: «Неиспользуемая ошибка: достигнуты истребители в 10 $(). Aborting! Наблюдатели, запущенные в последние 5 итераций: [[" fn: function (context) {\ n for (var i = 0, б = длина, часть,..?. я ...]]»

, и они, кажется, идут вместе и постраничной() в фильтре повторно вызывая много раз Как это исправить Любая помощь будет оценена

Ниже приводится filter.js, используемый для пагинации

var filters = angular.module('OptimaQuote.filters', []); 

    filters.filter('filterDependant', function() { 
    return function (input, dependant) { 
    var out = []; 
    if (!jQuery.isEmptyObject(input) && input != "undefined" && input && input.length) { 
     for (var i = 0; i < input.length; i++) { 
      if (input[i].Dependant == dependant){ 
       out.push(input[i]); 
      } 
     } 
    } 
    return out; 
    }; 
    }); 
    filters.filter('paginate', function() { 
return function(input, currentPage,rowsPerPage) { 
    if (!input) { 
     return input; 
    } 

    return input; 
    } 
    }); 

    filters.filter('getPaginator', function() { 
    return function(input, totolRowCount,rowsPerPage,paginatorSize,currentPage) {  
    var pageList = []; 
    var pages = []; 

    var noOfPages = parseInt(totolRowCount)/rowsPerPage; 


    function makePage(number, text) { 
      return { 
       number: number, 
       text: text, 
      }; 
      } 
    var startPage = 1; 
    var endPage = noOfPages; 
    if(noOfPages!= null && noOfPages!= "undefined"){ 
    if(paginatorSize < noOfPages){ 

     startPage = ((Math.ceil(currentPage/paginatorSize) - 1) * paginatorSize) + 1; 

     endPage = Math.min(startPage + paginatorSize - 1, noOfPages); 
    } 
    } 

    // Add page number links 
    for (var number = startPage; number <= endPage; number++) { 
     var page = makePage(number, number); 
     pages.push(page); 
    } 

    // Add links to move between page sets 
    if (paginatorSize < noOfPages) { 
     if (startPage > 1) { 
     var previousPageSet = makePage(startPage - 1, '...'); 
     pages.unshift(previousPageSet); 
     } 

     if (endPage < noOfPages) { 
     var nextPageSet = makePage(endPage + 1, '...'); 
     pages.push(nextPageSet); 
     } 
    } 



    return pages; 
} 
    }); 

    filters.filter('getEndPage', function() { 
    return function(input, totolRowCount, rowsPerPage) { 

    totalPages = []; 

    function makePage(number, text) { 
     return { 
      number: number, 
      text: text, 
     }; 
     } 

    var noOfPages = parseInt(totolRowCount)/rowsPerPage; 
    var temp = makePage(noOfPages,noOfPages); 
    totalPages.push(temp); 
    return totalPages; 

} 

});

Ниже приводится шаблон, используемый для реализации разбиения на страницы призывающих фильтров

<tfoot> 
    <tr> 
     <td colspan="{{this.paginatorColSpan}}"> 
      <div> 
       <ul class="paginate"> 
       <li><a ng-class="" ng-click="{{this.firstPageClick}}">First</a></li> 
        <li><a ng-class="{firstPage:{{this.currentPageNumber}}+1==1}" ng-click="{{this.prevClick}}">Previous</a></li> 
        <li ng-repeat="value in pageList|getPaginator:{{this.totalRowCount}}:{{this.pageSize}}:{{this.paginatorSize}}:{{this.currentPageNumber}}+1"> 
        <a ng-class="{active: value.number=={{this.currentPageNumber}}+1}" ng-click="{{this.pageClick}}">[[value.text]]</a> 
        </li> 
        <li ng-repeat="value in pageList|getEndPage:{{this.totalRowCount}}:{{this.pageSize}}"> 
        <a ng-class="{firstPage:{{this.currentPageNumber}}+1==value.number}" ng-click="{{this.nextClick}}">Next</a></li> 
        <li ng-repeat="value in pageList|getEndPage:{{this.totalRowCount}}:{{this.pageSize}}"> 
        <a ng-class="" ng-click="{{this.pageClick}}">Last</a></li> 

       </ul> 
      </div> 
     </td> 
    </tr> 
</tfoot> 

Answer 1

Попробуйте

{firstPage:((currentPageNumber+1)==1)} 

вместо

{firstPage:{{this.currentPageNumber}}+1==1} 

Также в другом месте вы сделали {{}}, Я вижу totalRowCount и currentPageNumber и pageSize и ngClick.

Можете ли вы создать jsFiddle своей проблемы? Кажется, вы используете угловой неправильно.

Answer 2

Прежде чем я исправила эту проблему, это было так:

{ 
    field : 'appId', 
    cellTemplate : '<a href="javascript:void(0);" ng-click="modify(row.entity)" style="color:Blue">Edit</a><a href="#" ng-click="review(row.entity)" style="margin:5px;color:Blue">View</a>', 
    displayName : 'operation' 
} 

После того как я исправила эту проблему это было так:

{ 
    field : 'appId', 
    cellTemplate : '<a href="javascript:void(0);" ng-click="modify(row.entity)" style="color:Blue">Edit</a><a href="javascript:void(0);" ng-click="review(row.entity)" style="margin:5px;color:Blue">View</a>', 
    displayName : 'operation' 
} 

Если вы хотите использовать <a></a> в этом CellTemplate, вы может использовать <a href="javascript:void(0);" > </a> вместо <a href="#" > </a> или <a href=""></a>. Это сработало для меня!