ko.bindingHandlers.allowBindings = {init: function(elem, valueAccessor) {// Let bindings proceed as normal *only if* my value is falsevar shouldAllowBindings = ko.unwrap(valueAccessor());return { controlsDescendantBindings: !shouldAllowBindings };}
};

<div data-bind="allowBindings: true"><!-- This will display Replacement, because bindings are applied --><div data-bind="text: 'Replacement'">Original</div>
</div><div data-bind="allowBindings: false"><!-- This will display Original, because bindings are not applied --><div data-bind="text: 'Replacement'">Original</div>
</div>

ko.bindingHandlers.withProperties = {init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {// Make a modified binding context, with a extra properties, and apply it to descendant elementsvar innerBindingContext = bindingContext.extend(valueAccessor);ko.applyBindingsToDescendants(innerBindingContext, element);// Also tell KO *not* to bind the descendants itself, otherwise they will be bound twicereturn { controlsDescendantBindings: true };}
};

<div data-bind="withProperties: { emotion: 'happy' }">Today I feel <span data-bind="text: emotion"></span>. <!-- Displays: happy -->
</div>
<div data-bind="withProperties: { emotion: 'whimsical' }">Today I feel <span data-bind="text: emotion"></span>. <!-- Displays: whimsical -->
</div>

ko.bindingHandlers.withProperties = {init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {// Make a modified binding context, with a extra properties, and apply it to descendant elementsvar childBindingContext = bindingContext.createChildContext(bindingContext.$rawData, null, // Optionally, pass a string here as an alias for the data item in descendant contextsfunction(context) {ko.utils.extend(context, valueAccessor());});ko.applyBindingsToDescendants(childBindingContext, element);// Also tell KO *not* to bind the descendants itself, otherwise they will be bound twicereturn { controlsDescendantBindings: true };}
};

<div data-bind="withProperties: { displayMode: 'twoColumn' }">The outer display mode is <span data-bind="text: displayMode"></span>.<div data-bind="withProperties: { displayMode: 'doubleWidth' }">The inner display mode is <span data-bind="text: displayMode"></span>, but I haven't forgottenthat the outer display mode is <span data-bind="text: $parentContext.displayMode"></span>.</div>
</div>