Question

我将此作为我的自举数据，当从数据库中检索到任何内容时，我将其推送到模型：

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。主要问题是我不知道如何获得＆amp;单击并触发removeTrigger处理程序时，从DOM中删除此元素。看一些例子，我在处理程序中看到了这个：

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

但这不起作用。

有什么想法吗？！

Answer 1

不要将触发器传递到page.render，而是尝试使用model.ref，如此

对于Derby 0.5

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

对于Derby 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();

Derby.js - 添加/删除唯一列表元素

1 个答案: