Ractive 事件可以在使用三重语法呈现的标记中工作吗？

Question

如果我的 Ractive 模板中有以下内容：

<span on-click='handleClick'>click me</span>

然后我可以用这个监听点击：

app.on({
    handleClick:function() {
        alert("clicked!") ;
    }
})

但是假设我将相同的标记存储在一个名为 clicklyspan 的字符串变量中：

app.set("clicklyspan", "<span on-click='handleClick'>click me</span>")

然后我使用三重隐藏语法在模板中呈现它：

{{{clicklyspan}}}

不再触发 handleClick 侦听器。我能做些什么来强制对呈现的模板进行某种更新，以便侦听器工作吗？说吧，在我这样做之后 app.set() call?

这里 fiddle 演示了这个问题。

谢谢，戴夫

Answer 1

我从来没有用过 Ractive，但我做了一些研究，看来你必须使用 partials，像这样：

var app = new Ractive({
  el: 'container',
  template: '#template',
  data: {
    myFunction: function() {
        var template = '<a on-click="handleClick">I can now be clicked as well!</a>';
        if (!this.partials.myFunction) {
            this.partials.myFunction = template;
        }
        else {
            this.resetPartial('myFunction', template);
        }
        return 'myFunction';
    }
  }
});

你还需要用这个代替三胡子：

{{> myFunction() }}

这里是对应的jsfiddle.

当然，把myFunction换成你喜欢的名字就可以了

我觉得有用的相关问题：

Ractive 事件可以在使用三重语法呈现的标记中工作吗？

Can Ractive events work in markup rendered with the triple-stash syntax?

ractivejs