0
많은 페이지에 템플릿을 표시해야합니다. 내가 녹아웃을 사용하려고합니다. 다음과 같이KO 관찰 가능 배열 채우기 문제
<head>
<script data-main="js/main" src="js/libs/require/require.js"></script>
</head>
<body>
<header>
<div id='div1' data-bind="template: {name: 'testTemplate'}"></div>
</header>
</body>
testTemplate.html은 다음과 같습니다 :
<div>
<button data-bind="click:function(data){$root.test(data)}">Test</button>
<!-- ko foreach: globalNavItems -->
<p> <a data-bind="text: label, attr:{href: url}"> <span class=""></span>
</a></p>
<!-- /ko -->
</div>
내가 globalNavItems 버튼 시험의 클릭에 채워야 할
나는 다음과 같은 내용으로 index.html 파일이 있습니다.
require(['knockout', 'jquery', 'text!../patterntemplates/testTemplate.html'],
function(ko, $, t0) {
function headerViewModel() {
var self=this;
self.globalNavItems =ko.observableArray([]);
self.test = function(data){
global_nav_dropdown_items =
ko.observableArray([{"label": "preferences","url":"Menu.html"},
{"label": "help","url": "#"},
{"label": "about","url": "#"},
{"label": "sign out","url": "#"}]);
self.globalNavItems=global_nav_dropdown_items;
}
}
oj.koStringTemplateEngine.install();
ko.templates["testTemplate"] = t0;
$(document).ready(function() {
ko.applyBindings(new headerViewModel(),
document.getElementById('div1'));
});
});
내가 index.html을 실행하는 동안의 버튼을 볼 수 있습니다 다음과 같이 내 main.js이다. 버튼을 클릭하면 메소드 테스트도 호출되지만 globalNavItems가 채워지지 않아 내 페이지에 표시된 링크를 볼 수 없습니다.
포인터가 있습니까?
감사
예, 작동하지만 내가 관찰 배열을 일반 배열로 global_nav_dropdown_items을 정의했다하지. 예제에서와 같이 global_nav_dropdown_items를 ko 관찰 가능 배열로 정의하면 self.globalNavItems (global_nav_dropdown_items); 작동하지 않습니다. – user3792795
아, 미안 해요 - 정의가 측면에서 스크롤 된 것처럼 그리워했습니다 :) 예 - 이것은 전달되는 일반 배열 일뿐입니다. 똑같은 방식으로 적용됩니다 .- 'self.globalNavItems'에 새로운 것을 지정하자마자 더 이상 페이지가 원래 바인딩 된 관찰 가능하지 않기 때문에 바인딩이 변경 사항을 인식하지 못합니다. 그건 녹아웃과 함께 볼 일이야 - 당신이 관찰 할 수 있어야 무언가에 할당 찾으십시오, 그것은 _probably_ 잘못이야 :) –
설명 주셔서 감사합니다. – user3792795