Knockout.js의 Hello World
2857 단어 JavaScriptknockoutjs
캡처
표시hello wrold!
.
소스 코드
index.html<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
<body>
<span data-bind="text: message"></span>
<script>
ko.applyBindings({
message: 'hello wrold!'
});
</script>
</body>
CDN
Knockout은 환경을 단순화하기 위해 CDN을 통해 가져옵니다.<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
binding
<span data-bind="text: message"></span>
ViewModel의 속성을 >에 바인딩합니다.data-bind
속성에서 귀속 목표 속성 이름과 귀속 속성 이름을 지정합니다.
ViewModel 적용
ko.applyBindings({
message: 'hello wrold!'
});
ko.applyBindings
함수에 ViewModel을 전달합니다.
ViewModel은 개체일 수 있습니다.
ViewModel에 바인딩되는 속성을 정의합니다message
.
감상
여기까지는 >의 속성으로 쓴 이상한 기법의 템플릿 엔진으로 보입니다.
관련 보도
Knockout으로 이벤트 프로세서 바인딩
링크
일본어 문서가 많아서 정말 큰 도움이 됐어요.
index.html
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
<body>
<span data-bind="text: message"></span>
<script>
ko.applyBindings({
message: 'hello wrold!'
});
</script>
</body>
CDN
Knockout은 환경을 단순화하기 위해 CDN을 통해 가져옵니다.
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-debug.js"></script>
binding
<span data-bind="text: message"></span>
ViewModel의 속성을 >에 바인딩합니다.data-bind
속성에서 귀속 목표 속성 이름과 귀속 속성 이름을 지정합니다.ViewModel 적용
ko.applyBindings({
message: 'hello wrold!'
});
ko.applyBindings
함수에 ViewModel을 전달합니다.ViewModel은 개체일 수 있습니다.
ViewModel에 바인딩되는 속성을 정의합니다
message
.감상
여기까지는 >의 속성으로 쓴 이상한 기법의 템플릿 엔진으로 보입니다.
관련 보도
Knockout으로 이벤트 프로세서 바인딩
링크
일본어 문서가 많아서 정말 큰 도움이 됐어요.
Knockout으로 이벤트 프로세서 바인딩
링크
일본어 문서가 많아서 정말 큰 도움이 됐어요.
문서|Knockout일본어 문서
Reference
이 문제에 관하여(Knockout.js의 Hello World), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/ledsun/items/e843e8e257bf46bb94a4텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)