inserting dynamic html into durandal views

Question

I am dynamically inserting html in durandal views but it does'nt work can any one help me out in that? my sample html is

in durandal view

<div data-bind="foreach:arrayofmodels">
    <div data-bind="html:dynamichtml"/>
  </div>

in my model(not view model) which is going to insert dynamic html

dynamichtml(<span data-bind="click:Mymodelclickfunction"/>);

in my viewmodel

    var arrayofmodels=ko.observableArray();
     vm={
         arrayofmodels:arrayofmodels;
       }
return vm;

there is a separate function to get list of model objects and push them into arrayofmodels array .

I understand the problem is inserting html after bindings were applied, but how to solve this issue?

Answer 1

Updated:

Have you considered using Durandal's compose mechanism for that purpose? Assuming that the model returns a constructor function with a Mymodelclickfunction property something along the following should get you started.

model.js

define(function() {
    return function() {
        this.Mymodelclickfunction = function(){
           //...
        }
    };
});

model.html

<div>
    <span data-bind="click:Mymodelclickfunction"/>
</div>

Update based on comment durandal view

<div data-bind="foreach:arrayofmodels">
    <!-- ko compose: $data -->
    <--/ko -->
</div>

Take a look at the view-composition section of http://dfiddle.github.io/dFiddle-1.2/#/view-composition to see some more examples.