나는 이미 많이 검색했지만 내 문제를 처리하는 방법을 알 수 없습니다. 사용자 컴포넌트를 생성했고 템플릿이 <script type="text/html"></script>태그 내에 있습니다. 이 템플릿 외부에는 무언가를 한 후에 조작하려고하는 변수가 있습니다. 이것은 작동하지 않으며 정의되지 않았습니다. 관찰 가능한 것을 조작 할 가능성이 있습니까?
내 코드는 다음과 같습니다.
HTML :
<customcomponent></customcomponent>
<script type="text/html" id="customcomponent-tpl">
<span data-bind="text: foo">Foo</span>
<span data-bind="text: bar">Bar</span>
</script>
<span data-bind="text: foobar">Foobar</span>
JS :
var customComponentViewModel = function() {
this.foo = ko.observable();
this.bar = ko.observable();
this.foobar = ko.observable();
this.foo('Foo!');
this.bar('Bar!');
this.foobar('Foo! Bar!');
console.log(this.foo());
console.log(this.bar());
console.log(this.foobar());
};
// do another stuff...
/**
* Register KO component
*/
ko.components.register('customcomponent', {
viewModel: customComponentViewModel,
template: {
element: 'customcomponent-tpl'
}
});
ko.applyBindings();
미리 감사드립니다!
마티아스
문제는 문서에 적용되는 뷰 모델이 전혀없고 컴포넌트 뷰 모델 만 있다는 것 입니다.
이 시도:
var vm = { foobar: ko.observable('') };
ko.applyBindings(vm);
그리고 컴포넌트 뷰 모델에서 :
ko.dataFor(document.body).foobar('Foo! Bar!');
바이올린 참조
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다