Подписка на изменение значения атрибута компонента #42
Description
Привет всем. Сразу к делу!
Суть в том, что хочется создать что-то типа значение selected у option (вложенного в select), но у span с input(type='text').
То есть создать компонент типа "изменяемый текст" - надпись, которая, если нажать, заменяется на поле ввода, пользователь редактирует значение, нажимает Enter и значение обновляется (у других пользователей в том числе).
Есть уже готовая реализация данного компонента, но был обнаружен баг в самом фреймворке (или у меня руки из Ж, подскажите).
В общем тестовый проект
В пустом проекте в index.jade
each _page.items
button.btn.btn-default(on-click='deleteItem(this.id)') {{this.title}}
test-comp(value='{{this.title}}')и в index.js
app.component(require('../../components/test-comp'));
app.proto.deleteItem = function(id) {
this.model.del('items.' + id);
}
app.get('/', function(page, model) {
model.subscribe('items', function() {
if (!model.get('items')) {
model.add('items', { title: 'item 1'});
model.add('items', { title: 'item 2'});
model.add('items', { title: 'item 3'});
model.add('items', { title: 'item 4'});
model.add('items', { title: 'item 5'});
}
model.filter('items', true).ref('_page.items');
page.render('home');
});
});(стандартная часть пропущена)
Создаём в папке component папку test-comp
В самом компоненте index.jade
index(element='test-comp'):
p {{@value}}
p
b {{value}}index.js компонента
module.exports = TestComp;
function TestComp() {}
TestComp.prototype.view = __dirname;
TestComp.prototype.init = function(model) {
model.subscribe('value', function() {
console.log('value: ' + model.get('value'));
model.on('change', 'value', function(n, o) {
console.log('value changed from ' + o + ' to ' + n);
})
});
}Всё хорошо работает и правильно отображается до тех пор, пока не начать кликать на кнопки. Значение простого текста меняется правильно, а значение полужирного ведёт себя странно. Как раз в index.js компонента строка model.subscribe('value', ...) подписывается как раз на выделенное жирным значение, что видно в консоли.
Вывод консоли при удалении третьего элемента:
value changed from item 3 to undefined
value changed from item 4 to item 5
value changed from item 5 to undefined
Скрин:
Подписка на @value не работает. Как можно корректно обрабатывать изменение значения аттрибута?
Рассчитываю на вашу помощь
Спасибо
PS. Спасибо за прекрасный фреймворк, некоторые вещи делаются оочень просто, приятно работать. Но и вопросов много, надеюсь смогу найти ответы.