KnockoutJS UI 도우미 바인딩

Question

KnockoutJS를 사용하여 UI 자동화를하고 있습니다. 제 질문은 상당히 간단합니다. KnockoutJS를 사용하면서 다음과 같은 것을 만들고 싶습니다.

<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> 

: :이 endresult는 같아야합니다

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

작동하지 않습니다. 둘째로, 바인딩 된 속성의 이름을 검색하는 방법이 느껴지고 iffy처럼 보입니다. 어쩌면 누군가 나를 더 나은 해결책으로 이끌 수 있습니다.

시간과 인내심을 가져 주셔서 감사합니다. 카를로스

Answer 1

이런 종류의 것은 Knockout에 이미 내장되어 있습니다. http://knockoutjs.com/documentation/template-binding.html 템플릿 바인딩을 살펴보십시오. 나는 당신이 성취하려고하는 것을 정확히 할 것이라고 확신합니다.