映射不能使用api调用

我想让所有内部员工属性为可观察的，所以我尝试了淘汰赛映射插件。但是，使用它之后，数据没有正确绑定。下面是javascript代码：映射不能使用api调用

var employeeViewModel = new function() { 
    var self = this; 
    self.employees = ko.observableArray(); 
    self.loading = ko.observable(true); 
}(); 

$(document).ready(function() { 
    ko.applyBindings(employeeViewModel); 
    GetEmployees(); 
}); 

function GetEmployees() 
{ 
    $.get('/api/Employees', null, function (data) { 
     if (employeeViewModel.employees.length == 0) { 
      employeeViewModel.employees = ko.mapping.fromJS(data); 
     } 
     else { 
      ko.mapping.fromJS(data, employeeViewModel.employees); 
     } 
     //employeeViewModel.employees(data); //This works but want to make all inner properties as observable 
     employeeViewModel.loading(false); 
    }); 
}

HTML代码：

<div class="loadingImg" data-bind="visible: loading()"></div> 
 
<table class="table table-bordered" data-bind="visible: !loading()"> 
 
    <thead> 
 
     <tr> 
 
      <th>Name</th> 
 
      <th>Email</th> 
 
      <th>Salary</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody data-bind="foreach:employees"> 
 
     <tr data-bind="template: {name: 'edit-template', data: $data }"></tr> 
 
    </tbody> 
 
</table> 
 

 
<script type="text/html" id="display-template"> 
 
    <td data-bind="text: Name"></td> 
 
    <td data-bind="text: Email"></td> 
 
    <td data-bind="moneyFormat: Salary"></td> 
 
</script> 
 
<script type="text/html" id="edit-template"> 
 
    <td><input class="form-control" type="text" data-bind="value: Name" /></td> 
 
    <td><input class="form-control" type="text" data-bind="value: Email" /></td> 
 
    <td><input class="form-control" type="text" data-bind="value: Salary" /></td> 
 
</script>

的主要问题是，它出现，但没有得到某种方式绑定。下面是结果： -

enter image description here

下面的代码工作，但如何实现通过映射插件一样吗？我以为我们可以通过映射插件在1行中做同样的事情，但它不起作用。需要帮助的..可能是我在这里失去了一些东西..

 employeeViewModel.employees(ko.utils.arrayMap(data, function (employee) { 
 
      var obsEmployee = { 
 
       Name: ko.observable(employee.Name), 
 
       Email: ko.observable(employee.Email), 
 
       Salary: ko.observable(employee.Salary) 
 
      } 
 
      return obsEmployee; 
 
     } 
 
     ));

来源

2015-06-05 Vishal Avalani

你尝试过这个'employeeViewModel.employees（ko.mapping.fromJS（数据））''mapping'插件它所做的是使平面JSON数据来观测。欢呼声 –

检查这个例子，让你的想法http://jsfiddle.net/supercool/LkqTU/24514/。欢呼声 –

你不应该使用“新功能”。 http://stackoverflow.com/a/10406585/1048572 –

不要创建employees observableArray。它受到applyBindings的限制，然后您从ko.mapping.fromJS重新指定它。您需要使用if绑定，而不是visible，以防止在映射和绑定之前敲除尝试访问员工。

<table class="table table-bordered" data-bind="if: !loading()">

例子：http://jsfiddle.net/qxc19joy/

来源

2015-06-05 20:21:43

非常感谢。现在非常棒！ –

映射不能使用api调用

回答

相关问题