Knockout.js KnockoutJS UI帮助程序绑定
我正在使用KnockoutJS实现一些UI自动化。我的问题相当简单;在使用KnockoutJS时,我想创建如下内容:Knockout.js KnockoutJS UI帮助程序绑定,knockout.js,custom-binding,Knockout.js,Custom Binding,我正在使用KnockoutJS实现一些UI自动化。我的问题相当简单;在使用KnockoutJS时,我想创建如下内容: <div data-bind="textboxFor: FirstName"></div> 使用自定义绑定。最终结果应该如下所示: <!-- Name --> <div class="control-group"> <label class="control-label" for="txtFirstName">
<div data-bind="textboxFor: FirstName"></div>
使用自定义绑定。最终结果应该如下所示:
<!-- Name -->
<div class="control-group">
<label class="control-label" for="txtFirstName">FirstName:</label>
<div class="controls">
<input id="txtFirstName" type="text" data-bind="value: FirstName" />
</div>
</div>
我试过:
ko.bindingHandlers.textboxFor = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
var propertyName, display;
var valueList = element.attributes['data-bind'].nodeValue.split(',');
valueList.forEach(function (node) {
if (node.indexOf('textboxFor') !== -1) {
propertyName = node.split(':')[1].trim();
}
});
if (!viewModel.translations) {
display = propertyName.charAt(0).toUpperCase() + propertyName.slice(1);
}
else {
display = viewModel.translations[propertyName];
}
var _innerHTML = "<label class='control-label' for='txt" + propertyName + "'>" + display + ":</label>" +
"<div class='controls'>" +
"<input id='txt" + propertyName + "' type='text' data-bind='value: " + propertyName + "' />" +
"</div>";
element.className = "control-group";
element.innerHTML = _innerHTML;
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
// This will be called once when the binding is first applied to an element,
// and again whenever the associated observable changes value.
// Update the DOM element based on the supplied values here.
}
};
但这不适用于绑定。
ko with: Person
其次,我检索绑定属性名称的方式感觉和看起来都很不确定。也许有人能告诉我更好的解决办法
提前感谢您的时间和耐心!
Carlos这种东西已经内置到敲除中,请查看模板绑定:。我很确定这会达到您想要达到的效果。谢谢您的回复,但模板并不是我真正想要的。模板是在一些随机的html代码中使用脚本标记定义的。我希望将此功能作为我的框架的一部分,因此是模块化的。