Was ist der Ansatz, um AngularJS Beobachter in jQuery Datenquellen zu verwenden

Question

Unsere Anforderung ist es, mehr als 1000 Zeilen auf einer einzigen Seite anzuzeigen, aber dann sollten wir auch zeigen/verstecken Schaltfläche in einer der Spalten. Diese Schaltfläche wird bei einer Aktion durch den NG Watcher umgeschaltet. Wir haben nicht Problem haben, während diese viele Datensätze anzeigt, aber die Leistung verschlechtert, wenn Beobachter verwendet wurden - aus dem offensichtlichen Grund, dass Beobachter auf die Anzahl der Zeilen direkt proportional sind

1. Wir wollen nicht
Paginieren
2. Wir möchten auf AngularJS Beobachter nutzen und ng-Modelle

Plz kann jemand vorschlagen, wenn es eine Alternative zu jQuery Datentabellen oder eine Hack-Beobachter zu verwenden, ohne auf die Leistung zu beeinträchtigen.

Answer 1

Ohne den Code zu sehen, klingt es, als ob Sie einen $ scope erstellen. $ Achten Sie auf jede Zeile in der Tabelle. Es ist nicht überraschend, dass Sie Leistungsprobleme sehen. Stattdessen würde ich so etwas tun, die zu einem reagiert ng Sie auf Plunker Here Reihe Zustand zu ändern:

View.html

<div ng-repeat="item in items"> 
    {{item.name}} 
    <div ng-show="showHide[$index]===false"> 
    Showing Me for index {{$index}} 
    </div> 
    <button ng-click="toggle($index)"> 
    <span ng-show="showHide[$index]===true || showHide[$index]===undefined">Show</span> 
    <span ng-show="showHide[$index]===false">Hide</span> 
    </button> 
</div> 

Controller.js

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

app.controller('demoController', function($scope) { 

    $scope.input = []; 
    $scope.editing = {}; 

    $scope.items = [{id: 1, name: 'One'}, {id: 2, name: 'Two'}, {id: 3, name: 'Three'}] 
    $scope.showHide = {}; 

    $scope.toggle = function(index) { 
    if ($scope.showHide[index] === undefined) { 
     $scope.showHide[index] = true; // assume show is default 
    } 
    $scope.showHide[index] = !$scope.showHide[index]; 
    } 

});