녹아웃에서 미리 채워진 observableArray

저는 knockout.js를 처음 사용하며 웹 페이지의 예를 통해 작업했습니다. 관련 작품의 예로는 Ajax todo list입니다. 목록의 항목은 브라우저와 서버 사이에서주고받습니다.녹아웃에서 미리 채워진 observableArray

댓글 목록이있는 웹 사이트를 만들려고합니다.

<ul data-bind="foreach: comments, visible: comments().length > 0"> 
    <li> 
     <input data-bind="value: title, disable: isDone" /> 
     <a href="#" data-bind="click: $parent.removeComment">Delete</a> 
    </li> 
</ul>

사이트를로드 할 때 observableArray 객체를 사용하고 녹아웃으로 전체 ul-list를 만들 수 있습니다. 그러나 나는 또한 사이트가 javascript와 ajax (검색 엔진이 색인을 생성하고 자바 스크립트가없는 사용자도 사용할 수 있도록)없이 작업하기를 원합니다. 따라서 기존의 주석이 html로있는 서버에서 사이트를로드 할 수 있다면 더 좋습니다. 그러나 knockout.js는 새로 추가 된 주석과 동일한 방식으로 기존 주석을 처리하고 싶습니다. 즉, 모든 li 요소를 comments-observableArray에 포함 시키십시오. html로 서버에서로드 된 주석 요소도 있습니다. 이것이 가능한가? 그리고 어떻게?

출처

2013-07-17 Sebastian Langer

아니요, 녹아웃 데이터 소스와 html을 '혼합'할 수 없습니다. 그러나 HTML을 표시 한 다음 녹아웃을 사용하여 동적 주석을 표시 할 수 있습니다.

콜백 함수 인 Ajax의 observableArray 주석에 새 항목을 추가 할 수 있습니다.

초기화 바인딩

var vm = { 
    comments : ko.observableArray([...]) 
}; 
ko.applyBindings(vm);

서버 콜백 함수

var ajaxCallback = function(items){ 
    ko.utils.arrayForEach(items, function(item){ 
     vm.comments.push(item); 
    });  
}

는 클라이언트 측에서 코멘트 배열을 초기화 서버에서 스크립트를 생성 할 수있을 수 있습니다.

도움이되기를 바랍니다.

출처

2013-07-17 09:30:22 Damien

그건 유감이지만, 당신의 대답은 나에게 또 다른 생각을주었습니다. 나는 HTML로 목록을 채울 수 있었고 추가적으로 필요한 모든 데이터를 보낼 수있었습니다. javascript를 사용할 수 있다면 목록에서 이전 항목을 모두 제거하고 observableArray 데이터를 사용할 수 있습니다. –

이 문제를 해결하려면 내 관찰 가능 항목을 JSON으로 미리 채우고 렌더링을 위해 서버 측에 동일한 JSON을 전달합니다. 결과 HTML은 다음과 같이 보입니다 :

<input data-bind="value: title" value="{{title}}" />

저는 NodeJS/Handlebars를 사용하지만, 서버 측/템플릿 조합의 수에 제한이 없습니다. 예 : PHP/Smarty.

출처

2015-03-17 11:26:02 martinedwards

녹아웃에서 미리 채워진 observableArray

답변

관련 문제