Knockout Js“您不能多次将绑定应用于同一元素”答案

【问题标题】：Knockout Js "You cannot apply bindings multiple times to the same element"Knockout Js“您不能多次将绑定应用于同一元素”
【发布时间】：2017-01-20 14:53:14
【问题描述】：

我正在使用 kendo 移动应用程序构建器，并且我正在使用淘汰赛 js 进行绑定，但是我收到错误“您不能将绑定多次应用于同一元素”。我的代码下面有两个包含绑定的 javascript 文件

//Employee.js//

function EmployeeViewModel() {
   this.EmployeeName= ko.observable();
   this.EmployeeMobile= ko.observable();
   this.EmployeeEmail= ko.observable(); }
   ko.applyBindings(new EmployeeViewModel());

//Company.js//
function CompanyViewModel() {
   this.CompanyName= ko.observable();
   this.CompanyMobile= ko.observable();
   this.CompanyEmail= ko.observable(); }
   ko.applyBindings(new CompanyViewModel());

//In index page i am using this both script file drag and drop//
<html>
 <head>
 </head>
 <body>
  <script src="Employee.js"></script>
  <script src="Company.js"></script>
 </body>
</html>

【问题讨论】：

标签： javascript jquery knockout.js knockout-mapping-plugin

【解决方案1】：

“ko.applyBindings”函数有 2 个参数：

applyBindings(viewModelOrBindingContext, rootNode);

第一视图模型

second - 绑定将应用到的 DOM 节点

您调用“ko.applyBindings”方法两次 - 在两个函数中，仅使用第一个参数。这意味着您要将两个不同的模型绑定到同一个节点 - 文档根。这会导致错误。

您可以使用两种方法：

创建一个具有子模型的全局视图模型并仅应用一次绑定：

//Employee.js//
function EmployeeViewModel() {
   this.EmployeeName= ko.observable();
   this.EmployeeMobile= ko.observable();
   this.EmployeeEmail= ko.observable();
}

//Company.js//
function CompanyViewModel() {
   this.CompanyName= ko.observable();
   this.CompanyMobile= ko.observable();
   this.CompanyEmail= ko.observable();
}

//In index page i am using this both script file drag and drop//
<html>
 <head>
 </head>
 <body>
  <script src="Employee.js"></script>
  <script src="Company.js"></script>
  <script>
   ko.applyBindings({ employee: new EmployeeViewModel(), company: new CompanyViewModel() });
  </script>
 </body>
</html>

将绑定应用到不同的节点：

```

//Employee.js
function EmployeeViewModel() {
   this.EmployeeName= ko.observable();
   this.EmployeeMobile= ko.observable();
   this.EmployeeEmail= ko.observable();
   ko.applyBindings(new EmployeeViewModel(), document.getElementById("employee"));
}

//Company.js
function CompanyViewModel() {
   this.CompanyName= ko.observable();
   this.CompanyMobile= ko.observable();
   this.CompanyEmail= ko.observable();
   ko.applyBindings(new CompanyViewModel(), document.getElementById("company"));
}

//In index page i am using this both script file drag and drop//
<html>
 <body>
  <script src="Employee.js"></script>
  <script src="Company.js"></script>
  <div id="employee"></div>
  <div id="company"></div>
 </body>
</html>

```

【讨论】：

【解决方案2】：

多次应用绑定。您需要先清除绑定。

如下图

var element = $('#elementId')[0]; 
ko.cleanNode(element);

那么只有你可以在同一个元素上再次应用绑定。

【讨论】：

这是做什么的？对我来说，这听起来像是您删除了绑定，这意味着您不会多次拥有它..