Knockout custom binding with multiple parameters

by JonNorman

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-debug.js"></script>
<div data-bind="fullName: { firstName: firstName, lastName: lastName } "></div>
<button data-bind="click: changeName">Click me to change name</button>

JavaScript

ko.bindingHandlers.fullName = {
    init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
    },
    update: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
        var params = valueAccessor();
        element.innerHTML = params.firstName() + ' ' + params.lastName();
    }
}

function ViewModel() {
    this.firstName = ko.observable('John');
    this.lastName = ko.observable('Doe');
    this.changeName = function() {
        this.firstName('Jane');
        this.lastName('Roe');
    }
}

ko.applyBindings(new ViewModel());