Is there any way to limit the scope of a knockout.js application? [closed]

Question

I have a legacy project which I have been approved to work in a knockout.js module. This is great, however the application is extremely complex and I need to use some of the pre-built form validation of our application.

My form validators work fine until a dynamic template gets switched out. I can't for the life of me figure out the error. Nothing in the console and my vast debugging efforts have been fruitless.

I'm thinking that my solution could be something along the lines of limiting the scope of the knockout application similar to how one can declare ng-app in angular.js.

I can't find a working example of how to do this or any documentation relevant to knockout.js

Answer 1

The scope to which elements knockout binds itself with is determined from the way you call ko.applyBindings. It takes two parameters, an object to be used as the root view model and an element to "apply" the bindings on. The latter parameter is optional and usually tutorials and documentation leaves it out like this:

ko.applyBindings(viewModel);

By default, without the second parameter, knockout will apply the bindings on the whole document. If you want to limit the bindings from one specific HTML element you can specify it as the second parameter to be used as a parent instead of the document. Pretty much like this:

var parent = document.getElementById('someElementId');
// or if you are using jquery, use $('#someElementId')[0]

ko.applyBindings(viewModel, parent);

It is briefly described in this section of the knockout docs.