CODEWITHSUNDEEP
javascriptknockout.js
Dirk Boer
Dirk Boer

Reputation: 9075

Knockout subscribe/event type system without observable?

I want to make use of the subscribe() function of knockout js to manually trigger an event at a certain point.

I could make an observable() and everytime put a GUID in there to trigger the scubscribe.

Is there a cleaner way within Knockout js to have a typical event-like structure?

Edit Ok, apparently I can use observable.valueHasMutated() - might already a a bit cleaner that using a GUID.

Example

This is the behaviour that I'm looking for:

function Car()
{
    var self = this;

    self.onOpenDoor = ko.observable();

    self.openDoor = function()
    {
        // using an observable / valueHasMutated for this feels a bit hacky
        // is there an other way to use the underlying subscribe() system?
        self.onOpenDoor.valueHasMutated();
    }
}


var car = new Car();

// multiple subscribers
car.onOpenDoor.subscribe(function()
{
    console.log('Do something');
})
car.o**nOpenDoor.subscribe(function()
{
    console.log('Do something else');
})

car.openDoor();

I am aware this is not the default 'knockout' way to do stuff - that is not what this question is about.

Update

After @RoyJ's reference to Niemeyer's blog I went for this solution:

function Car()
{
    var self = this;

    self.onOpenDoor = new ko.subscribable();

    self.openDoor = function()
    {
        self.onOpenDoor.notifySubscribers();
    }
}

Upvotes: 1

Views: 1075

Answers (1)

Roy J
Roy J

Reputation: 43881

Update If you're just looking for clarity, you can use notifySubscribers instead of valueHasMutated. You might want to take a look at the base type of observables, ko.subscribable.

I would do it like this:

var vm = {
    ///...definitions...
    openCount: ko.observable(0),
    openDoor: function () {
        vm.openCount(vm.openCount()+1);
    }
};

vm.openCount.subscribe(function () {
    ///...do something
});

vm.openCount.subscribe(function () {
    ///...do something else
});

ko.applyBindings(vm);

Demo http://jsfiddle.net/uoqdfhdb/2/

Upvotes: 2

Related Questions