Як додати / вставити елемент у ObservableArray у певній позиції за допомогою Knockout.js


75

Усі приклади нокауту, які я знайшов, здаються, додають новий елемент у кінець ObservableArray, використовуючи щось на зразок:

viewModel.SomeItems.push(someNewItem);

Це, звичайно, розміщує елемент у кінці масиву.

Як додати елемент до ObservableArray у певній позиції?

напр. щось на зразок:

viewModel.SomeItems.push(someNewItem, indexToInsertItAt);

Відповіді:


83

Ви повинні мати можливість використовувати власний spliceметод JavaScript -

viewModel.SomeItems.splice(2,0,someNewItem);

Документи тут - https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/splice

Приклад тут (не для нокауту) - Як вставити елемент у масив із певним індексом?

З документів "Нокаут" -

Для функцій, що модифікують вміст масиву, таких як push і splice, методи KO автоматично запускають механізм відстеження залежностей, щоб усі зареєстровані слухачі отримували повідомлення про зміну, а ваш інтерфейс користувача автоматично оновлювався.


7
Дякую. Сплайсинг спрацював. Для користувачів, що нокаутують, ko.utils.arrayIndexOf також корисний, якщо ви хочете знайти індекс для вставки нового елемента на основі існуючого елемента.
Mark Robinson

1
Це не буде працювати з розрідженими масивами, принаймні це не стосується мене в хромі. Дивіться мою відповідь нижче
Адам Теген

23

Для нокауту

viewModel.SomeItems.unshift(someNewItem);

Див. Також: http://knockoutjs.com/documentation/observableArrays.html


15
Це вставить елемент на початку масиву, тому не допоможе, якщо ви хочете вставити елемент десь посередині.
Марк Робінсон

1
Я якось пропустив частину про вставку його де-небудь у масиві. Так, це працює, лише якщо ви хочете вставити на початок. Вибач за це.
Тревіс Кавано,

12

Я зробив цю функцію розширення, яка мені добре працювала. Зрощування не працювало для мене, якщо я додавав у кінець розріджений масив.

ko.observableArray.fn.setAt = function(index, value) {
    this.valueWillMutate();
    this()[index] = value;
    this.valueHasMutated();
}

Це навіть працює з:

var a = ko.observableArray(['a', 'b', 'c']);
a.setAt(42, 'the answer');

2
І якщо ви хочете зробити insertAt, а не setAt, просто перейдіть this()[index] = value;на this.splice(index, 0, value);. Дякую Адаме!
Brian S
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.