2014-12-08 3 views
0

여러 개의보기 모델을 구현하려고하는 간단한 녹아웃 설치가 있습니다. 한가지 문제, 즉 toJSON의 올바른 사용은 저를 배제합니다.여러보기 모델을 가진 녹아웃 toJson

내 HTML은 다음과 같습니다

<!DOCTYPE html> 
<html> 
<head> 
<title>Playground</title> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<link rel="stylesheet" href="content/css/bootstrap.css" type="text/css" media="all" /> 

<script type="text/javascript" src="lib/jquery-2.1.1.min.js"></script> 
<script type="text/javascript" src="lib/knockout-3.2.0.js"></script> 
<script type="text/javascript" src="lib/bootstrap.js"></script> 

</head> 
<body> 
<div class="container" id="appHost"> 
<section id="nameHeader"> 
    <label> 
    First Name: 
    <input data-bind="value: firstName, enable: canEdit" /> 
    </label> 
    <button data-bind="click: toggleEdit" class="btn btn-primary">Toggle Edit</button> 
</section> 
<section id="other"> 
    <label> 
    First Name: 
    <input data-bind="value: firstName, enable: canEdit" /> 
    </label> 

    <button data-bind="click: toggleEdit" class="btn btn-primary">Toggle Edit</button> 

</section> 

<h2>Debugging View</h2> 
<pre data-bind="text: ko.toJSON({name1: self.NameViewModel, name2: self.OtherViewModel})"></pre> 

<script type="text/javascript" src="sample.js"></script> 
</div> 
</body> 
</html> 

내 sample.js은 다음과 같습니다

(function (app, $, ko) { 
    var self = this; 

    var NameViewModel = function() { 
    var self = this; 

    self.firstName = ko.observable(''); 
    self.canEdit = ko.observable(true); 

    self.toggleEdit = function() { 
     self.canEdit(!self.canEdit()); 
    }; 

    }; 

    var OtherViewModel = function() { 
    var self = this; 

    self.firstName = ko.observable(''); 
    self.canEdit = ko.observable(true); 

    self.toggleEdit = function() { 
     self.canEdit(!self.canEdit()); 
    }; 

    }; 

    $(document).ready(function() { 
    //ko.applyBindings(new NameViewModel()); 
    ko.applyBindings(new NameViewModel(), $("#nameHeader")[0]); 
    ko.applyBindings(new OtherViewModel(), $("#other")[0]); 
    }); 

})(window.app = window.app || {}, jQuery, ko); 

나는 $ 루트를 사용하는 하나 개의 뷰 모델이 너무 리팩토링하고, toJSON을 변경하는 경우, 페이지 예상대로 작동합니다. . . 즉, HTML의 "디버깅"섹션에서 내 모델의 JSON보기를 볼 수 있습니다.

toJSON을 사용하여보기 모델 별보기를 얻으려면 어떻게해야합니까? 또는 전체 페이지를 단일 JSON 객체로 가져 오려면 어떻게해야합니까? . . 그게 가능해?

ko.toJSON (NameViewModel를)

내 예제 코드는 위의 두 모델을 볼 수있는 나의 가장 최근의 시도이다 : 나는 노력했다.

도움을 주시면 감사하겠습니다.

답변

0

난 당신이 작동하지 않았다, 불행하게도

+0

찾고있는 무엇을 달성해야

ko.toJSON($data, null, 2) 

생각합니다. 변경 후 라인은
입니다. 변경 없음. –
                        
                            
                                
                            
                        
                    

+0

상단 섹션 요소 바로 위에 페이지 상단에 배치하십시오. 문제를 표시하기 위해 jsfiddle에 코드를 넣을 수 있다면이 방법이 도움이 될 것입니다. – peinearydevelopment

+0

다음은 jsfiddle입니다. http://jsfiddle.net/wj4sLs0y/1/ –