1

我将此作为我的引导数据,当从数据库中没有检索到任何内容时,我将其推送到模型:

var liveaudience = {

triggers : [
    {
        'trigger_id': 'vocal_stomp',
        'duration': 1000,
        'color': '#F23000',
        'sound': 'A#'
    },
    {
        'trigger_id': 'guitar_stomp',
        'duration': 600,
        'color': '#CC0234',
        'sound': 'Cmaj'
    },
    {
        'trigger_id': 'drum_pad',
        'duration': 1200,
        'color': '#CF2451',
        'sound': 'Emin'
    }
]

};

我有一条路线,它执行此操作,然后在模板上呈现这三个引导元素:

get('/:triggerId?', function(page, model, params){

    var triggers = model.get('liveaudience.triggers');
    if(typeof triggers === 'undefined'){
         // bootstrap triggers
         model.push('liveaudience.triggers', liveaudience.triggers);
    }

    model.subscribe("liveaudience.triggers", function(err, scopedModels){
        page.render({'triggers': scopedModels.get()[0]});
    });
});

然后是模板:

<ul id="triggers">
        {{#each triggers}}
            <li data-id="{{id}}" class="trigger" style="background-color:{{color}};">
                <span class="trigger-label">{{trigger_id}}</span>
                <a x-bind="click:removeTrigger" class="remove-trigger">x</a>
            </li>
        {{/}}
    </ul>

一切都显示出来了,但 {{id}} 返回一个函数,我希望它是一个唯一分配的GUID。主要问题是我不知道在单击和触发removeTrigger处理程序时如何从 DOM 中获取和删除此元素。查看示例,我在处理程序中看到了这一点:

model.at(e.target).remove();

但这不起作用。

有任何想法吗?!

4

1 回答 1

1

不要将触发器传递到 page.render 尝试使用 model.ref 像这样

对于德比 0.5

var triggers = model.at('liveaudience.triggers');
model.subscribe(triggers, function(err){
  model.ref('_page.triggers', triggers);
  page.render();
});

对于德比 0.3

model.subscribe('liveaudience.triggers', function(err,scopedModels){
  model.ref('_page.triggers', scopedModels);
  page.render();
});

然后像这样访问循环中的触发器

{{#each _page.triggers}}

这应该正确设置绑定。

然后删除(对于 Derby 0.5,对于 0.3 不确定)

e.at().remove();
于 2013-06-21T17:49:04.290 回答