Создайте новый массив KO.observable и заполните его из объекта массива
Можно ли создать массив ko.observable и заполнить его с помощью объекта массива?
Моя цель здесь - создать массив ko.observable со всем описанием / объектами, которые есть в исходном массиве.
//Sample data the original data is coming from an socket query and being push on the array("people")
var people = [{
name: "Contact 1",
address: "1, a street, a town, a city, AB12 3CD",
tel: "0123456789",
email: "[email protected]",
type: "family"
},
{
name: "Contact 2",
address: "1, a street, a town, a city, AB12 3CD",
tel: "0123456789",
email: "[email protected]",
type: "friend"
}
];.
var people = [{
name: "Contact 1",
address: "1, a street, a town, a city, AB12 3CD",
tel: "0123456789",
email: "[email protected]",
type: "family"
},
{
name: "Contact 2",
address: "1, a street, a town, a city, AB12 3CD",
tel: "0123456789",
email: "[email protected]",
type: "friend"
}
];
var quotesarray = function(items) {
this.items = ko.observableArray(items);
this.itemToAdd = ko.observable("");
this.addItem = function() {
if (this.itemToAdd() != "") {
this.items.push(this.itemToAdd());
this.itemToAdd("");
}
}.bind(this);
};
ko.applyBindings(new quotesarray(people));
console.info(people);
@supercool результат не определен
не могли бы вы оставить код в скрипке и показать ошибку, я могу помочь вам исправить ее.
@supercool jsfiddle.net/zo8ygfk4/4 здесь я просто сделаю простой
вы должны пройти через элемент (jsfiddle.net/zo8ygfk4/7). ko.applyBindings принимает 1-й параметр как viewModel. поскольку вы не упомянули ни одного параметра в секунду, по умолчанию он принимает документ.
@supercool, это работает со статическим массивом, но не работает с моим кодом, так как он исходит из сокета. Я всегда сталкиваюсь с этой ошибкой неперехваченной ошибки: вы не можете применять привязки несколько раз к одному и тому же элементу.
ну, вам не следует вызывать привязки Apply несколько раз, пока необходимость в них не отпадет. можно попробовать так jsfiddle.net/zo8ygfk4/17. Надеюсь, поможет
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Просто нужно было сделать items вместо quotesarray
var people = [
{ name: "Contact 1", address: "1, a street, a town, a city, AB12 3CD", tel: "0123456789", email: "[email protected]", type: "family" },
{ name: "Contact 2", address: "1, a street, a town, a city, AB12 3CD", tel: "0123456789", email: "[email protected]", type: "friend" }
];
var quotesarray = function(items){
this.items = ko.observableArray(items);
this.itemToAdd = ko.observable("");
this.addItem = function(){
if (this.itemToAdd() != ""){
this.items.push(this.itemToAdd());
this.itemToAdd("");
}
}.bind(this);
};
ko.applyBindings(new quotesarray(people));
console.info(people);<script src = "https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<table>
<thead>
<tr><th>name</th><th>address</th></tr>
</thead>
<tbody data-bind = "foreach: items">
<tr>
<td data-bind = "text: name"></td>
<td data-bind = "text: address"></td>
</tr>
</tbody>
</table>Спасибо, но это работает со статическим массивом, но не работает с моим кодом, так как он исходит из сокета. Я всегда сталкиваюсь с этой ошибкой. Неперехваченная ошибка: вы не можете применять привязки несколько раз к одному и тому же элементу.
Вы можете создать observableArray, на который сокет будет записывать сообщения. Вы subscribe в массив, чтобы получать автоматические уведомления при изменении содержимого (т.е. после каждой записи сокетом).
В обратном вызове subscribe вы очищаете массив и добавляете элементы в свойство вашей модели просмотра.
Если вы ожидаете получить много быстро следующих друг за другом сообщений, вы можете rateLimit массив, в который вы записываете, чтобы гарантировать, что вы не обновляете DOM слишком много раз.
Вот пример. Пояснения в комментариях к коду.
const UPDATE_EVERY_MS = 500;
// The observable array the socket writes to
const received = ko.observableArray([])
// Use a rateLimit extension if you expect to
// receive many updates from your socket
.extend({ rateLimit: UPDATE_EVERY_MS });
// The observable array in your viewmodel
const rendered = ko.observableArray([]);
received.subscribe(items => {
// Write "inbox" to viewmodel's list
rendered(rendered().concat(items));
// Clear received without triggering notification
items.length = 0;
});
ko.applyBindings({ items: rendered });
// Mock a socket that writes to `received`
setInterval(() => received.push(Math.random()), 200);<script src = "https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<ul data-bind = "foreach: rendered">
<li data-bind = "text: $data"></li>
</ul>
в значительной степени ты можешь это сделать, в чем проблема?