0

바인딩되지 않습니다
템플릿이 이미이 요소에 주입되었지만 아직 아니다 경계.개편, 구성 요소, 템플릿은 이미이 요소에 주입되었지만 아직 내가이 문장을 이해하지 못하는 <a href="http://knockoutjs.com/documentation/component-registration.html" rel="nofollow">Knockoutjs Docs</a>에서

ko.components.register('my-component', { 
viewModel: { 
    createViewModel: function(params, componentInfo) { 
     // - 'params' is an object whose key/value pairs are the parameters 
     // passed from the component binding or custom element 
     // - 'componentInfo.element' is the element the component is being 
     // injected into. When createViewModel is called, the template has 
     // already been injected into this element, but isn't yet bound. 

     // Return the desired view model instance, e.g.: 
     return new MyViewModel(params); 
    } 
}, 
template: ... 
}); 

답변

1

(가 정의되어 방법에 관계없이)는 이제 "내 구성 요소"에 대한 템플릿을 가정 해 봅시다

<span class="foo" data-bind="text: 'foo'"></span> 

문장 "템플릿은 이미이 요소에 주입 만하고있다가 아니다 아직 바인드 됨 "은 주어진 구성 요소에 대한 DOM의 상태를 설명합니다. (AKA componentInfo.elementcreateViewModel 함수의 문맥에서) 구성 요소를 결합하는 과정

, 구성 요소의 DOM은 다음과 같다 :

: 템플릿 구성 요소에 주입 된

전 주형 후

<my-component></my-component> 

구성 요소에 주입하지만, 결합 전에 발생되었습니다 (이것은, createViewModel가 호출 될 때, 따라서 콤은 DOM의 상태 NT) 바인딩 후

<my-component> <span class="foo" data-bind="text: 'foo'"> </span> </my-component> 
가 발생합니다 (뷰 모델을 반환했습니다 이것은 단지 creteViewModel 후 발생할 수) 스팬이 마지막 단계에서 텍스트 바인딩은 이제 적용되어 있기 때문에

<my-component> 
    <span class="foo" data-bind="text: 'foo'"> 
     foo 
    </span> 
</my-component> 

, text 바인딩이 구성 요소에 텍스트를 추가했습니다.


주석은 DOM은 당신이 원하는 경우에 KO 문서는 반대 권장하지만 당신이의 createViewModel 함수에서 구성 요소의 DOM 요소를 조작 할 수 있음을 의미 번째 상태에 있음을 표시하기위한 것입니다 : 일반적으로, 그것은 createViewModel

내부 에서 componentInfo.element에 작용하는 것이 아니라 단지 사용자 지정 바인딩을 직접 DOM 조작을 수행하는 것이 가장 좋습니다,

1

새로운 MyViewModel (PARAMS);

MyViewModel은 원하는보기 모델 인스턴스입니다. 이것은 녹아웃에서 사용되는 공장 디자인 후입니다.

viewmodel에 바인딩되기 전에 연관된 요소에 대한 설정 논리를 실행하거나 임의의 논리를 사용하여 인스턴스화 할 viewmodel 클래스를 결정하려면 다음을 입력하십시오. factory function 역할이 있습니다.

보기 모드는 런타임에 논리를 기반으로 선택됩니다.


템플릿

이미 소자에 주입되어 있지만, 미 바인드있다.

원하는보기 모달을 반환하면 사용자의 ko.components에 바인딩됩니다. 그래서