Нокаут Js " нельзя применять привязки несколько раз к одному и тому же элементу"

Я использую Kendo mobile app builder и использую knockout 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>
2 7
javascript knockout.js jquery knockout-mapping-plugin

2 ответа:

"ко.функция applyBindings принимает 2 аргумента: 

applyBindings(viewModelOrBindingContext, rootNode);

Модель первого вида

Второй узел DOM привязка будет применена к

Вы называете " ко.метод 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>

``

13

Применить привязку многократно. Вам нужно сначала очистить привязку.

Как показано ниже 

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

Тогда только вы можете применить привязку снова к тому же элементу.

0