Knockout: Binding external template files

问题:

Based on these questions:

• KnockoutJS: Using 'html' binding, new elements not binding
• knockout js foreach binding is not updating when used in custom element (components.register)

I have been testing several methods for importing html fragments to use as templates, but so far have no success on binding Knockout updates to them. I am hoping for another example so I can understand better.

ko.components.register('my-slideshow', {
    template: { element: 'my-slideshow' },
    viewModel: ViewModel
});

ko.components.register('ko-slideshow', {
    viewModel: ViewModel,
    template: { require: 'text!caro.html' }
});

In the first component, when the html is already present, everything works correctly. In the second component, the exact same html will load the correct information on init, but cannot be updated.

Here's Fiddle: https://jsfiddle.net/uecaj7a2/1/

(I did not know how to create external html file for the Fiddle, but it has the rest. This is my first Knockout project.)