knockoutjs in express using ejs
ejs, knockout.js, node.js
Solution
There are no compatibility issues with ejs - as far as I know - however you need to call `ko.applyBindings` after your DOM is loaded, from the documentation:
To activate Knockout, add the following line to a block:
`ko.applyBindings(myViewModel);`
You can either put the script block at the bottom of your HTML document, or you can put it at the top and wrap the contents in a DOM-ready handler such as jQuery’s $ function.
So you need to change your template to move the `ko.applyBindings` at the end:
<% layout('layout') -%>
<!-- Jquery Include-->
<script src="/js/jquery-2.1.0.min.js"></script>
<!-- Knockout Javascript Dependency-->
<script src="/js/knockout-3.0.0.js"></script>
<p>First Name: <span data-bind="text: firstName"></span></p>
<script type="text/javascript">
var viewModel = {
firstName = "Bert"
};
ko.applyBindings(viewModel);
</script>
Or use the jQuery’s `$` function:
<% layout('layout') -%>
<!-- Jquery Include-->
<script src="/js/jquery-2.1.0.min.js"></script>
<!-- Knockout Javascript Dependency-->
<script src="/js/knockout-3.0.0.js"></script>
<script type="text/javascript">
var viewModel = {
firstName = "Bert"
};
$(function() {
ko.applyBindings(viewModel);
});
</script>
<p>First Name: <span data-bind="text: firstName"></span></p>
Problem
I would like to start using knockoutjs in a web app currently based on Nodejs with express using ejs view engine. index.ejs ``` <% layout('layout') -%> <!-- Jquery Include--> <script src="/js/jquery-2.1.0.min.js"></script> <!-- Knockout Javascript Dependency--> <script src="/js/knockout-3.0.0.js"></script> <script type="text/javascript"> var viewModel = { firstName : "Bert" }; ko.applyBindings(viewModel); </script> <p>First Name: <span data-bind="text: firstName"></span></p> ``` It appears that knockout js is loading properly however, the data-binding is not working I simply see. First Name: Is there a compatibility issue loading knockout in an ejs file?