нокаут с боковой страницей, вызывающей Вы не можете применять привязки несколько раз к одному и тому же элементу - PullRequest
Новая
       28

нокаут с боковой страницей, вызывающей Вы не можете применять привязки несколько раз к одному и тому же элементу

1 голос
/ 28 января 2020

Я строю SPA, используя нокаут Js. Проблема, с которой я сталкиваюсь, состоит в том, что у меня есть страница боковой панели с несколькими ссылками привязки, которые будут загружать разные страницы в соответствии с фрагментом кода ниже 

 $('div#list a').click(function(){
    var page = $(this).attr('href');
    if (page == "new") {
        $('#container').load('application/application.jsp', function(data){
            //return false;
        });
        return false;
    } else if (page == "dashboard") {
        $('#container').load('dashboard/dashboard.jsp', function(data){
            //return false;
        });
        return false;
    }
 });

Для каждой страницы я загружаю соответствующие html и js. Например, если страница является новой в приведенном выше примере, html выглядит следующим образом: 

<form>......fields are there</form><script src="application/application.js"></script>

Мой Js файл выглядит следующим образом: 

var ApplicationForm = function () {
/* add members here */
/* the model */
var app = {
    nid: ko.observable(),
    lastName: "",
    firstName: "",
    address: "",
};

var addEmployment = function() {
};

var removeEmployment = function(params) {
};

var init = function () {
    /* add code to initialise this module */
    ko.applyBindings(ApplicationForm);
};

/* form submission */
var submit = function () {
    console.log(ko.toJSON(app ));
};

/**
 * subscribe to checkbox isdead and if false, clear the values
 */
app.isDead.subscribe(function(newValue) {
    //when false, clear all values
     if (!newValue) {
          //
     }
});

/* execute the init function when the DOM is ready */
$(init);

return {
    /* add members that will be exposed publicly */
    submit: submit,
    application: app,
    add: addEmployment,
    remove: removeEmployment
};

} () ;

Некоторые детали опущены. Проблема заключается в том, что каждый раз, когда я нажимаю на страницу боковой ссылки, она загружает соответствующую и JS, а также выдает ошибку Вы не можете применять привязки несколько раз к одному и тому же элементу , так как я вызываю applyBindings несколько раз.

Может кто-нибудь посоветовать мне, как мне оформить свою страницу, чтобы я не получил эту ошибку?

Большое спасибо.

1 Ответ

0 голосов
/ 28 января 2020

Поскольку вы повторно используете один и тот же элемент каждый раз, вам необходимо очистить предыдущие привязки, прежде чем применять новые. Это можно сделать с помощью ko.cleanNode(element);

. Это может сработать, чтобы поставить его на вершину вашей функции переключения следующим образом, но я не могу точно сказать, основываясь на опубликованном доступном коде. 

$('div#list a').click(function(){
    ko.cleanNode($('#container')[0]);
    ...

Вам также может понадобиться изменить свои applyBindings, чтобы нацеливаться только на тот же элемент, в зависимости от того, где еще вы используете привязки за пределами этого элемента. 

ko.applyBindings(ApplicationForm, $('#container')[0]);
...