Warum wird meine kundenspezifische Bindung ausgelöst?

Question

Ich habe eine seltsame Situation. Grundsätzlich habe ich zwei benutzerdefinierte Bindungen, mit denen das DOM -Element auf seinen neuen Wert animiert wird. Dies sind Awidth und Aright, die die Breite bzw. die richtigen Werte animieren.

Ich habe die solchen Bindungen implementiert:

<div class='classname' data-bind="aRight: right, aWidth: containerWidth, style: { zIndex: zindex, left: (left() + 'px'), height: (containerHeight() + 'px') }">

... und die benutzerdefinierten Bindungen sehen so aus:

            ko.bindingHandlers.aWidth =
            {
                update: function (element, valueAccessor, allBindingsAccessor, context)
                {
                    // Get the value accessor
                    var value = valueAccessor();

                    // Get the new width and the duration of the animation
                    var newWidth = ko.utils.unwrapObservable(value);
                    var duration = 500;

                    $(element).animate({ width: newWidth }, duration, "swing");
                }
            };

            ko.bindingHandlers.aRight =
            {
                update: function (element, valueAccessor, allBindingsAccessor, context)
                {
                    // Get the value accessor
                    var value = valueAccessor();

                    // Get the new width and the duration of the animation
                    var newRight = ko.utils.unwrapObservable(value);
                    var duration = 500;

                    $(element).animate({ right: newRight }, duration, "swing");

                    console.log("aRight Called: newRight - " + newRight + ", duration - " + duration);
                }
            };

Das Problem tritt also auf, wenn wir ein anderes beobachtbares als meine zwei benutzerdefinierten Bandenobestellen, z. B. Zindex, ändern.

Wenn wir den beobachtbaren Zindex ändern, wird der Wert im DOM korrekt aktualisiert, aber aus irgendeinem Grund wird meine arightbindung auch ausgelöst! ...

Ich habe keinen Hinweis darauf in meiner aright -benutzerdefinierten Bindung, daher kann es sicherlich keine Abhängigkeit geben?

Meine arightbindung wird auch ausgelöst, wenn meine Awidth -Bindung ebenfalls ausgelöst wird, was auch etwas seltsam ist!

Hat jemand irgendwelche Ideen dazu?

Danke vielmals!

Andy.

Aktualisieren

Dies ist der Teil des Ansichtsmodells, der den Index aktualisiert, der, wenn meine aright-benutzerdefinierte Bindung an das Feuer ist (dies ist übrigens sehr viel Psudo-Code!):

    var page = function()
    {
        this.zindex = ko.observable(0);
        this.right = ko.observable(0);
        // and other observables....
    }

    var viewModel = function()
    {
        var pages = ko.oberservableArray();
        // populate the pages array etc...

        this.someMethod = function()
        {
            // Do some stuff...
            this.anotherMethod();
            // Do some other stuff
        }
        .bind(this);

        this.anotherMethod() = function
        {
            var pageCount = this.pages().length;
            for (var pageNum = 0; pageNum < pageCount; pageNum++)
            {
                var page = this.pages()[pageNum];
                page.zindex(/* a different value */); // This is what causes my aRight binding to fire...
            }
        }
        .bind(this);
    }

Aktualisieren

Ich habe gerade einen Beitrag hier gelesen: http://groups.google.com/group/knockoutjs/browse_thread/thread/26a3157ae68c7aa5/44c96d1b748f63bb bbbbbb748f63bb

Sprichwort:

Zusätzlich wird eine Bindung ihre Aktualisierungsfunktion erneut ausgeführt, wenn auch eine andere Bindung im selben Datenbindungsattribut ausgelöst wird.

Bedeutet dies, dass ich sehe, dass meine benutzerdefinierte Bindung ausgelöst wird, wenn eine andere Bindung des Datenbindungsattributs ausgelöst wird (es passiert nur, dass Zindex die erste ist, die ich sehe, die Änderungen sehe)? Ist das nicht ein bisschen seltsam/falsch? ...

Aktualisieren

Ich habe eine einfache Geige, von der ich denke, dass sie mein Problem so ziemlich zusammenfasst. Es scheint, als würde jede Bindung desselben Datenbindungsattributs so viel benutzerdefinierte Bindung aktualisieren!

http://jsfiddle.net/j6epx/2/

Hmmm ... schätzt, dass ich es umgehen muss, indem ich meine benutzerdefinierte Bindung manuell einchecken muss, ob sich der Wert tatsächlich geändert hat oder nicht !! Besiegt dies nicht diesen tatsächlichen Punkt einer Bindung ???

Ich habe auch eine genauere Frage in den Knockout -Foren gestellt: http://groups.google.com/group/knockoutjs/browse_thread/thread/d2290d96e33f1d5a

Answer 1

Dies ist derzeit entworfen. Alle Bindungen in einer Datenbindung werden ausgelöst, wenn eine der Bindungen abfeuert. Dies liegt daran, dass sie alle in einen einzigen abhängigen Diensten eingewickelt sind. In einigen Fällen haben Bindungen eine Abhängigkeit zwischeneinander (wenn die Optionen aktualisiert werden, muss der Wert ausgeführt werden, um sicherzustellen, dass es sich immer noch um einen gültigen Wert handelt). In einigen Fällen verursacht dies jedoch ein Problem.

Es gibt ein anderes Muster, das Sie beim Erstellen einer benutzerdefinierten Bindung verwenden können, die dazu beiträgt, dieses Verhalten zu mildern. Anstatt die Eingeweide Ihrer Funktionalität in der Funktion "Update" zu definieren, würden Sie tatsächlich Ihre eigene abhängige Dienste in der Funktion "init" erstellen. Es würde so aussehen:

ko.bindingHandlers.custBinding= {
    init: function(element, valueAccessor) {
        ko.dependentObservable({
            read: function() {
                ko.utils.unwrapObservable(valueAccessor());
                alert("custBinding triggered"); 
            },
            disposeWhenNodeIsRemoved: element
        });
    }
};

http://jsfiddle.net/rniemeyer/ukufy/