중첩 모델에서 녹아웃 매핑 작성을 어떻게 사용자 정의합니까?

Question

녹아웃을 완전히 처음 접했고 서버에서 JSON 응답을 녹아웃 매핑 플러그인을 사용하여 특정 모델에 매핑하려고합니다. 모델은 중첩되어 있으며 내포 된 모델에서도 create 콜백을 사용하여 객체 생성을 무시하려고합니다. 그러나 내 매핑 옵션이 제대로 읽히지 않는 것으로 보입니다. 예 JSON :

{ 
    "EmployeeFeedbackRequestSubmissions": [ 
     { 
      "EmployeeFeedbackRequestSubmissionId": 0, 
      "Employee": "John Smith0", 
      "EmployeesWorkedWith": [ 
       { 
        "EmployeeName": "Joe Smith", 
        "ProjectsWorked": [ 
         { 
          "ProjectName": "Document Management Console" 
         }, 
         { 
          "ProjectName": "Performance Eval Automation" 
         }, 
         { 
          "ProjectName": "Business Tax Extensions" 
         } 
        ] 
       }, 
       { 
        "EmployeeName": "Michael Jones", 
        "ProjectsWorked": [ 
         { 
          "ProjectName": "Document Management Console" 
         }, 
         { 
          "ProjectName": "Performance Eval Automation" 
         }, 
         { 
          "ProjectName": "Business Tax Extensions" 
         } 
        ] 
       }, 
       { 
        "EmployeeName": "Jason Smith", 
        "ProjectsWorked": [ 
         { 
          "ProjectName": "Document Management Console" 
         }, 
         { 
          "ProjectName": "Performance Eval Automation" 
         }, 
         { 
          "ProjectName": "Business Tax Extensions" 
         } 
        ] 
       }, 
       { 
        "EmployeeName": "Robert Will", 
        "ProjectsWorked": [ 
         { 
          "ProjectName": "Document Management Console" 
         }, 
         { 
          "ProjectName": "Performance Eval Automation" 
         }, 
         { 
          "ProjectName": "Business Tax Extensions" 
         } 
        ] 
       } 
      ] 
     } 
     // more EmployeeFeedbackRequestSubmissions 
    ] 
} 

매핑 옵션 :

var mappingOptions = { 
    // overriding default creation/initialization code 
    'EmployeeFeedbackRequestSubmissions': { 
     create: function (options) { 
      return (new(function() { 
       this.EmployeeHeading = ko.computed(function() { 
        return "Performance Evaluation Employee: " + this.Employee(); 
       }, this); 

       ko.mapping.fromJS(options.data, {}, this); 
      })()); 
     }, 
      'EmployeesWorkedWith': { 
      create: function (options) { 
       return new instance.EmployeesWorkedWithModel(options.data); 
      } 
     } 
    } 
}; 

샘플 바이올린 전체 예제와 함께 : http://jsfiddle.net/jeades/9ejJq/2/

결과는 EmployeesWorkedWithModel에서 계산 된 nameUpper를 사용 할 수 있어야한다. 또한 이것을 처리하는 가장 좋은 방법이 아니기 때문에 더 나은 방법을 제안합니다.

Answer 1

거의 다 왔었습니다. 똑바로하기 위해 노력 : http://jsfiddle.net/jiggle/na93A/ 매핑 옵션을 사용하면 ko.mapping.fromJSON

에 따라서

을 전달할 때, 매핑은, 이름에서 매핑을 찾아 볼 것 플러그 중첩 할 필요가 없습니다 객체

당신은 '사용 나는 당신의 로컬 참조로 "자기"를 사용했다

var self = this; 

    self.mappingOptions = { 
     // overriding default creation/initialization code 
     'EmployeeFeedbackRequestSubmissions': { 
      create: function (options) { 
       return (new(function() { 
        this.EmployeeHeading = ko.computed(function() { 
         return "Performance Evaluation Employee: " + this.Employee(); 
        }, this); 

        ko.mapping.fromJS(options.data, self.mappingOptions, this); 
       })()); 
      } 
     }, 
     'EmployeesWorkedWith': { 
       create: function (options) { 
        // return new instance.EmployeesWorkedWithModel(options); 
        return (new(function(){ 
         ko.mapping.fromJS(options.data, {}, this); 

         this.nameUpper = ko.computed(function() { 
          return this.EmployeeName().toUpperCase(); 
         }, this); 
        })()); 
       } 
     } 

    }; 

공지 사항'이 '대신에'예 '의 단지 (코드를 읽기 쉽도록하기 : 당신의 매핑 옵션 객체는 단일 레벨이어야한다 메인 뷰 모델에서 '인스턴스').

또한 mappingOptions 객체를 FeedbackViewModel의 일부로 만들었으므로이 객체를 mapping.fromJS 호출에 전달해야하므로 'EmployeesWorkedWith'수준의 데이터가 해당 객체에 대한 mappingOptions를 갖게됩니다.

에서 :

ko.mapping.fromJS(options.data, {}, this); 

에 :

ko.mapping.fromJS(options.data, self.mappingOptions, this); 

그런 다음 생성 (당신이 호출 할 수있는 기능으로 'EmployeesWorkedWith'수준에 대한 생성 코드를 이동할 수 있습니다,하지만 난 그것을 유지했습니다 'EmployeeFeedbackRequestSubmissions'레벨을 작성하는 것과 같이 위에 표시된대로 mappingOptions에 추가하십시오.

그런 다음 인스턴스를 제거 할 수 있습니다 .EmployeesWorkedWithModel fu 전부 다.

작업 바이올린

는 여기에서 찾을 수 있습니다 :

http://jsfiddle.net/jiggle/na93A/

또는, 당신이 'EmployeeFeedbackRequestSubmissions'에 대한 작성에있을 때 별도의 mappingOptions 객체를 생성하고 하나의 객체에서 모든 수준의 매핑이 없습니다 이 바이올린에서 볼 수 있습니다. http://jsfiddle.net/jiggle/Avam7/

원하는 코딩 스타일에 따라 다르며 서로 다른 매핑 요구 사항이 있고 서로 다른 컬렉션 이름이있는 경우이를 구분하는 것이 중요합니다.

예 :

종업원

직원

직원 (이 수준에서 등 다른 computeds을해야 할 수도 있습니다)

그렇다면, 당신은 사용합니다 두 번째 옵션 (mappingOptions과 d를 사용하는 레벨로 전달)

콘솔에서 코드가 실행될 때 값을 볼 수 있도록 일부 console.log 문을 추가 했으므로 작동 방법을 이해하는 데 도움이됩니다.

희망이 있습니다.

Answer 2

ko.mapping의 좋은 점은 프로세스가 자동화되는 방법입니다. 결과를 확인하십시오. http://jsfiddle.net/9ejJq/26/

선언 된 매핑 중 하나만 사용하는 방법에 유의하십시오.

feedbackMappingOptions = { 
    create: function (options) { 
     return new FeedbackViewModel(options.data); 
    } 
}; 

거기에서 각보기 모델은 해당 하위 개체에 대한 매핑을 트리거합니다. 각각에 대한 매핑 옵션을 만들거나 EmployeesWorkedWith 아래에있는 최종 ProjectsWorked 객체에서 볼 수 있듯이 매핑에서 데이터를 바로 던지고 ko.mapping이 나머지를 수행합니다. 희망이 도움이되었습니다.