CODEWITHSUNDEEP
knockout.jstwitter-bootstrap-3requirejsknockout-3.2
4imble
4imble

Reputation: 14416

Passing a template into custom knockout binding

I would like to make a popover (bootstrap) custom binding.

I have defined this like so:

    ko.bindingHandlers.popover = {
        update: function (element, valueAccessor)
        {
            var template = ko.unwrap(valueAccessor);

            $(element).popover({
                placement: 'top',
                html: true,
                content: 'text!' + template() <---- How can i get html into here?
            });
        }
    };

   <button data-bind="popover: 'templates/mytemplate.html'">
      PopOver
   </button>

The issue is, I'm not sure how to inject the html i want. Naturally i'd like a template path to be resolved but working with requires text! plugin is not going as well as I had hope.

I suspect I am overlooking something much more simple?

Upvotes: 0

Views: 152

Answers (2)

Nh&#226;n Nguy&#234;̃n
Nh&#226;n Nguy&#234;̃n

Reputation: 91

Simply make an ajax request to your template

$.ajax(template).done(function (templateData) {
    $(element).popover({
        placement: 'top',
        html: true,
        content: templateData
        });
 });

Upvotes: 1

CrimsonChris
CrimsonChris

Reputation: 4641

Right now your template is the literal string 'templates/mytemplate.html'. That's probably not what you want, you want the text in that file. Use something like fs.readFileSync to synchronously get the text from that file.

If you intend to pass the path of your html into your binding you may want to change the variable name from template to path.

Upvotes: 0

Related Questions