Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.10.2012, 14:04
Yes Yes вне форума
Интересующийся
Отправить личное сообщение для Yes Посмотреть профиль Найти все сообщения от Yes
 
Регистрация: 12.08.2011
Сообщений: 17

Не получается удалить элемент Knockout
Всем привет!
В процессе изучения Knockout.js, разбора документации и примеров столкнулся с проблемой, которая завела меня в тупик, а именно у меня не получается удалить элемент методом .remove(),как в примере...
Вот ссылка на пример с офф. сайта http://knockoutjs.com/examples/contactsEditor.html
копирую, вставляю - все прекрасно работает!
По аналогии делаю свой простенький интерфейс
HTML:
The name is <input data-bind="value: personName" />
        <button data-bind="click: add">Add</button>
 <ul data-bind="foreach: people">
            <li><label data-bind="text: name"></label> <a href='#' data-bind='click: $root.del'> Удалить </a></li>
        </ul>

javascript:
var myViewModel = {
                           personName: ko.observable(0),
                people: ko.observableArray([
                    {"id":"1", "name":"Fries"},
                    {"id":"2", "name":"Eggs Benedict"},
                    {"id":"3", "name":"Ham"},
                    {"id":"4", "name":"Cheese"}

                ]),
                add: function(){this.people.push({'id':'8','name': this.personName()})},
                del: function(pep){this.people.remove(pep);}

            };
 ko.applyBindings(myViewModel);

В моем случае вылетает ошибка Uncaught TypeError: Cannot call method 'remove' of undefined Что я не так делаю?
Ответить с цитированием
  #2 (permalink)  
Старый 19.10.2012, 14:45
Yes Yes вне форума
Интересующийся
Отправить личное сообщение для Yes Посмотреть профиль Найти все сообщения от Yes
 
Регистрация: 12.08.2011
Сообщений: 17

Ура, Проблема Решена!
Переписал код след. образом:
HTML
The name is <input data-bind="value: personName" />
        <button data-bind="click: add">Add</button>

        <ul data-bind="foreach: people">
            <li><label data-bind="text: name"></label> <a href='#' data-bind='click: del'> Удалить </a></li>
        </ul>

JS
function model() {
    self=this;
    self.personName=ko.observable(0);
    self.people=ko.observableArray([
        {"id":"1", "name":"Fries"},
        {"id":"2", "name":"Eggs Benedict"},
        {"id":"3", "name":"Ham"},
        {"id":"4", "name":"Cheese"}

    ]);
    add=function(){this.people.push({id:'8','name': this.personName()})};
    del=function(pep){self.people.remove(pep);console.log(pep)};
}
ko.applyBindings(new model());

Все заработало, только не совсем понимаю почему ))) Буду благодарен за пояснения
Ответить с цитированием
  #3 (permalink)  
Старый 22.10.2012, 17:38
Профессор
Отправить личное сообщение для Hoshinokoe Посмотреть профиль Найти все сообщения от Hoshinokoe
 
Регистрация: 08.01.2012
Сообщений: 253

Yes,

почитайте про контекст выполнения http://learn.javascript.ru/this
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите удалить новый DOM элемент allforweb jQuery 1 26.01.2012 02:32
как удалить элемент в DOM? czp Общие вопросы Javascript 11 17.12.2011 20:55
Как можно удалить динамически созданный элемент Арсений Элементы интерфейса 18 08.07.2010 12:56
Как удалить элемент из документа HTML Dima00782 Общие вопросы Javascript 2 28.06.2010 17:32
имея this как удалить элемент из тела html clgs Общие вопросы Javascript 1 13.05.2009 17:55