2013-09-05 24 views
36

Mam aplikację o pojedynczej stronie, która używa knockout do powiązania danych. Widok CAApproval.html w mojej aplikacji do obsługi pojedynczej strony ma pole obserwowalne o nazwie AllCertificates w kodzie viewmodel. Zapełnia się dobrze na stronie. Po opuszczeniu widoku przez kliknięcie łącza w sekcji navigation.html strony, a następnie powrót do strony CAApproval, wartości z poprzedniej wizyty nadal znajdują się w obserwowalnym obiekcie AllCertificates i dlatego są wyświetlane w widoku CAAperpval.Jak wyczyścić zawartość obserwowalnej tablicy, która została wypełniona poprzednimi odwiedzinami do widoku

Muszę wyczyścić zawartość obserwowalnej karty AllCertificates za każdym razem, gdy użytkownik powróci na stronę CAApproval, która używa tej tablicy obserwacyjnej, tak że jeśli użytkownik opuści stronę i wróci, zawartość obserwowalnego pola jest zerowa, a zatem nie dane są wyświetlane na ekranie. Oto najważniejsze z mojego viewmodel Code

define(['services/logger', 'durandal/system', 'durandal/plugins/router', 'services/CertificateDataService','controls/Lucas'], 

     function(logger, system, router, CertificateDataService) { 
     var allCertificates = ko.observableArray([]); 

    var activate = function() { 
      // go get local data, if we have it 
      return SelectAllCerts(),SelectMyCerts(), GetCertificateDetails(), GetDDABankNums(); 
      }; 
     var vm = { 
      activate: activate, 
      allCertificates: allCertificates, 
    SelectAllCerts: SelectAllCerts 

     }); 

    return vm; 

    function SelectAllCerts() { 
       return CertificateDataService.getallCertificates(allCertificates); 
     } 
    }); 

Jak usunąć zawartość z observablearray każdym razem, gdy strona użytkownik przychodzi do tej strony (a nie podczas nawigowania w samej stronie, tylko wyczyścić observablearray gdy użytkownik pochodzi z oddzielnej strony)?

Odpowiedz

31

Wystarczy ustawić go równa nic (allCertificates([])) w Uaktywnienie funkcji, która jest wywoływana za każdym razem, gdy widoku modelu obciążenia -

function(logger, system, router, CertificateDataService) { 
    var allCertificates = ko.observableArray(); 

var activate = function() { 
    allCertificates([]); 
    // go get local data, if we have it 
    return SelectAllCerts(),SelectMyCerts(), GetCertificateDetails(), GetDDABankNums(); 
}; 

var vm = { 
    activate: activate, 
    allCertificates: allCertificates, 
    SelectAllCerts: SelectAllCerts 
}); 
+0

Perfect! Dzięki. Nadal używam nokautu. – Chris

+0

Wow. Szukałem podobnej odpowiedzi od ponad dwóch dni. Dziękuję bardzo za to! –

56

knockout także observableArray ma ciekawe sposoby. Zadzwoń pod numer removeAll, aby wyczyścić wszystkie pozycje.
Spójrz na oficjalną stronę observable array manual.

self.mycertificates = ko.observableArray(['C1', 'C2']); 
self.mycertificates.removeAll(); 
+4

Jakieś korzyści z wydajności dla tej czy PW Kada? –

+2

Przynajmniej to jest bardziej czytelne. – Nisarg

3

Dla Jeremy T (za mało miejsca w komentarzu).
Pierwszy powód i absolutnie wystarczający dla mnie jest istnienie publicznie dostępnego API dla pożądanego celu.

Aby jednak oszacować wydajność, sprawdź źródło. "ObservableArray" jest również "obserwowalny" z dodatkowymi funkcjami wtryskiwanymi do obiektu.

Więc inicjalizacji wygląda następująco:

ko.observableArray = function (initialValues) { 
    initialValues = initialValues || []; 

    if (typeof initialValues != 'object' || !('length' in initialValues)) 
     throw new Error("The argument passed when initializing an observable array must be an array, or null, or undefined."); 

    var result = ko.observable(initialValues); 
    ko.utils.extend(result, ko.observableArray['fn']); 
    return result.extend({'trackArrayChanges':true}); 
}; 

ko.observable = function (initialValue) { 
    var _latestValue = initialValue; 

    function observable() { 
     if (arguments.length > 0) { 
      // Write 

      // Ignore writes if the value hasn't changed 
      if (!observable['equalityComparer'] || !observable['equalityComparer'](_latestValue, arguments[0])) { 
       observable.valueWillMutate(); 
       _latestValue = arguments[0]; 
       if (DEBUG) observable._latestValue = _latestValue; 
       observable.valueHasMutated(); 
      } 
      return this; // Permits chained assignments 
     } 
     else { 
      // Read 
      ko.dependencyDetection.registerDependency(observable); // The caller only needs to be notified of changes if they did a "read" operation 
      return _latestValue; 
     } 
    } 
    if (DEBUG) observable._latestValue = _latestValue; 
    ko.subscribable.call(observable); 
    observable.peek = function() { return _latestValue }; 
    observable.valueHasMutated = function() { observable["notifySubscribers"](_latestValue); } 
    observable.valueWillMutate = function() { observable["notifySubscribers"](_latestValue, "beforeChange"); } 
    ko.utils.extend(observable, ko.observable['fn']); 

    ko.exportProperty(observable, 'peek', observable.peek); 
    ko.exportProperty(observable, "valueHasMutated", observable.valueHasMutated); 
    ko.exportProperty(observable, "valueWillMutate", observable.valueWillMutate); 

    return observable; 
} 

i usunąć wszystkie elementy wygląda następująco:

'removeAll': function (arrayOfValues) { 
     // If you passed zero args, we remove everything 
     if (arrayOfValues === undefined) { 
      var underlyingArray = this.peek(); 
      var allValues = underlyingArray.slice(0); 
      this.valueWillMutate(); 
      underlyingArray.splice(0, underlyingArray.length); 
      this.valueHasMutated(); 
      return allValues; 
     } 
     // If you passed an arg, we interpret it as an array of entries to remove 
     if (!arrayOfValues) 
      return []; 
     return this['remove'](function (value) { 
      return ko.utils.arrayIndexOf(arrayOfValues, value) >= 0; 
     }); 
    }