web-dev-qa-db-de.com

So löschen Sie den Inhalt eines beobachtbaren Arrays, das von früheren Besuchen in einer Ansicht ausgefüllt wurde

Ich habe eine Einzelseitenanwendung, die Knockout für die Datenbindung verwendet. Die CAApproval.html-Ansicht in meiner Einzelseitenanwendung enthält im Code des Ansichtsmodells einen Beobachtungsbereich mit dem Namen AllCertificates. Es füllt gut auf der Seite. Wenn Sie die Ansicht verlassen, indem Sie auf einen Link im Abschnitt navigation.html der Seite klicken und dann zur Seite CAApproval zurückkehren, befinden sich die Werte des vorherigen Besuchs weiterhin im ObservableArray AllCertificates und werden daher in der CAApproval-Ansicht angezeigt.

Ich muss den Inhalt des AllCertificates-Beobachtungsfelds jedes Mal löschen, wenn ein Benutzer zur CAApproval-Seite zurückkehrt, die dieses Beobachtungsfeld verwendet. Wenn ein Benutzer die Seite verlässt und zurückkehrt, ist der Inhalt des Beobachtungsfelds null und daher werden keine Daten angezeigt der Bildschirm. Hier sind die Highlights meines Viewmodels 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);
        }
    });

Wie lösche ich den Inhalt eines Beobachtungsbereichs jedes Mal, wenn ein Benutzer zu dieser Seite gelangt (NICHT, wenn er innerhalb der Seite selbst navigiert, lösche ich den Beobachtungsbereich nur, wenn der Benutzer von einer separaten Seite kommt)?

41
Chris

Setzen Sie es einfach auf nichts (allCertificates([])) in Ihrer Aktivierungsfunktion, die jedes Mal aufgerufen wird, wenn Ihr Ansichtsmodell geladen wird.

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
});
41
PW Kad

Auch Knockout observableArray hat interessante Methoden. Rufen Sie removeAll auf, um alle Elemente zu löschen.
Schauen Sie sich die offizielle Seite an Handbuch für beobachtbare Arrays .

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

Für Jeremy T (nicht genügend Platz im Kommentar).
Der erste Grund und absolut genug für mich ist die Existenz einer öffentlich verfügbaren API für den gewünschten Zweck.

Aber um die Leistung abzuschätzen, können Sie die Quelle überprüfen. "observableArray" ist auch "observable" mit zusätzlichen Funktionen, die in das Objekt injiziert werden.

Die Initialisierung sieht also so aus:

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;
}

Und alle Elemente entfernen sieht so aus:

'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;
        });
    }
4
Maxim