KnockoutJS 和来自 JSON 对象的绑定数据

Question

在嵌套 JSON 对象的情况下，我无法从返回的 JSON 中获取数据。

HTML 代码如下：

<table>   
<thead>
    <tr>
        <th>Name</th>
        <th>DOB</th>
        <th>Gender</th>
        <th>Address</th>
        <th>URL</th>
    </tr>
</thead>
   <tbody data-bind="foreach: rows">
    <tr>
        <td data-bind="text: resource.name[0].text"></td>
        <td data-bind="text: dob"></td>
        <td data-bind="text: gender"></td>
        <td data-bind="text: address"></td>
        <td data-bind="text: fullUrl"></td>
    </tr>
</tbody>
</table>    

然后是 KnockoutJS

   function PatientsViewModel() {
      var self = this;

      self.rows= ko.observableArray([]);
      self.resources = ko.observableArray([]);
      self.name = ko.observableArray([]);
      self.text = ko.observable("");
      self.dob = ko.observable("");
      self.gender = ko.observable("");
      self.address = ko.observable("");
      self.fullUrl = ko.observable("");

        $.getJSON(
            "/proxy.php",
            {
                last: "john",
                first: "smith",
                dob: 19700101

            },
            function (data) {
                console.log(JSON.stringify(data.entry));
                self.rows(data.entry);
            }
        );

    }

    ko.applyBindings(new PatientsViewModel());

JSON 响应结构如下：

[
   {
      "fullUrl":"https://www.example.com/Patient/123",
      "resource":{
         "resourceType":"Patient",
         "id":"123",
         "identifier":[
            {
               "use":"official",
               "type":{
                  "coding":[
                     {
                        "system":"http://hl7.org/fhir/v2/0203",
                        "code":"MR",
                        "display":"test data"
                     }
                  ],
                  "text":"test"
               },
               "system":"1.2.3.4.5",
               "value":"123",
               "assigner":{
                  "display":"PatientId"
               }
            }
         ],
         "active":true,
         "name":[
            {
               "use":"usual",
               "text":"John Smith",
               "family":[
                  "Smith"
               ],
               "given":[
                  "John"
               ]
            }
         ],
         "gender":"Male",
         "birthDate":"1970-01-01",
         "address":[
            {
               "use":"home",
               "type":"both",
               "line":[
                  ""
               ],
               "city":"",
               "state":"",
               "postalCode":"",
               "country":""
            }
         ]
      },
      "search":{
         "mode":"match",
         "score":0
      }
   }
]

当我尝试绑定来自 JSON 响应的数据时，仅适用于 fullUrl 无法获得类似 resource.name[0].text、resource.birthDate 等的任何内容

我错过了什么提示？

Answer 1

只需添加一些断点，我确定您在使用 getJSON 获取数据之前会进行 KO 绑定（请参阅：getJSON does not honor async:false）。

另一个问题可能是您获得的数据是 JSON，并且不是可观察的，但您可以轻松地提供帮助：var koViewModel = ko.mapping.fromJS(uiModel);但是你也需要这个 JS 库：knockout.mapping.js