Обновить элемент html с привязкой к нокауту js

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

Uncaught Error: You cannot apply bindings multiple times to the same element.

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

<!DOCTYPE html>
<html>
<head>
<script src="js/knockout-3.0.0.js"></script>
<script>

var Person = [ {
    name : "qwe qwe",
    number : 123123123
}, {
    name : "asd asd",
    number : 999999999
} ];

var myVM = function() {
    this.persons = ko.observableArray(Person);
}

function init() {   
alert(Person.length);
    ko.applyBindings(new myVM());   
}

function AddPerson()
{
PushToArray(Person,"name","123");
init();
}

function PushToArray(array, var1, var2) {
    array.push({
        name : var1,
        number : var2
    });
}
</script>

</head>
<body onload="init()">
            <div>
                <button onclick="AddPerson()">Add</button>              
                    <div data-bind="foreach:persons">
                        <p data-bind="text:name"> </p>
                    </div>                      
            </div>      
</body>
</html>

knockout.js jquery-mobile-listview
person mayurd    schedule 18.02.2014    source источник
comment
вам не нужно вызывать ko.applyBindings(new myVM()) при добавлении человека, это нужно делать только один раз   -  person Cris    schedule 18.02.2014
comment
Спасибо чувак, твое предложение сработало   -  person mayurd    schedule 18.02.2014

Ответы (1)


arrow_upward
0
arrow_downward

Функция ko.applyBindings() должна вызываться только один раз. С этого момента каждое изменение, которое вы вносите в наблюдаемые объекты в модели представления, будет автоматически отражаться в парне.

Просто удалите вызов функции init(); внутри вашей функции AddPerson() и вызовите ее только один раз из другого места, и это должно решить проблему.

person Maurizio In denmark    schedule 18.02.2014
comment
Извините, не было ясно, что после удаления init() вам все равно придется вызывать его откуда-то еще, но только один раз. - person Maurizio In denmark; 18.02.2014