ko.bindingHandlers.myCustomBinding = {
init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
// This will be called when the binding is first applied to an element
// Set up any initial state, event handlers, etc. here
if (bindingContext.$data.init) bindingContext.$data.init(element, valueAccessor, allBindings, viewModel, bindingContext);
},
update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
// This will be called once when the binding is first applied to an element,
// and again whenever any observables/computeds that are accessed change
// Update the DOM element based on the supplied values here.
if (bindingContext.$data.update) bindingContext.$data.update(element, valueAccessor, allBindings, viewModel, bindingContext);
}
};
constructor.prototype.init = function(element, valueAccessor, allBindings, viewModel, bindingContext) {
// All the buttons in the buttons group need the same name,
// but they all need distinct ids. We use timestamps because
// as components, the names and ids should be distinct across
// multiple instances of each component.
var timeStamp = new Date().getTime();
$('input:radio').attr('name', timeStamp).button();
$('input:radio:eq(0)').attr('id', timeStamp+1);
$('input:radio:eq(1)').attr('id', timeStamp+2);
$('input:radio:eq(2)').attr('id', timeStamp+3);
// Initialize the number-picker
$('input[name="number-picker"]').TouchSpin();
};
var compName = ko.observable();
//...
compName(switchToComponent);
setTimeout(function(){
// this code is queued until after the component is rendered.
}, 0);
5条答案
按热度按时间ssgvzors1#
我无法让这个方法像上面的帖子一样工作。但是我在git问题列表中找到了一个解决方法,它不需要自定义KO绑定。
在您的组件模板html或代码字符串中添加下面的行。
然后在您的模块/ viewModel中创建一个init函数:
或者根据您的viewModel结构:
就像一个护身符。它的工作例子在这里
http://jsfiddle.net/gLcfxkv6/1/
此处为knockout git上的线程:https://github.com/knockout/knockout/issues/1533
感谢git上的吸血鬼提供了变通方案。
afdcj2ne2#
这里的秘密是http://knockoutjs.com/documentation/custom-bindings.html
所以在我组件模板中,我做了如下操作
在组件viewModel上我只实现init和/或update,例如:
Knockout文档可以通过指出这个非常有用的例子来改进。而且,这是一个非常有用的绑定,例如,应该有一个标准的'init'和'update'绑定
axr492tv3#
在不同组件之间切换后,我们需要访问组件中的DOM元素。我们希望在组件上使用不存在的“afterRender”绑定。
我们使用Javascript setTimeout解决了这个问题,让KO先进行渲染,然后将代码排队。
于飞:
切换组件的代码:
2w2cym1i4#
从knockout 3.5.1开始,您可以在
viewModel
中添加一个koDescendantsComplete
函数,该函数将在渲染完成后触发请访问:https://github.com/knockout/knockout/blob/2db9f7f79939ed289621de72340ab048362ed76b/src/components/componentBinding.js#L73
vmjh9lq95#
做一个新的装订,像这样
如果你不使用ES6(巴别塔等),你不需要导出。
然后,在组件html中,可以执行以下操作
在组件模型中