トリプルスタッシュ構文でレンダリングされたマークアップで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()と呼んでもいいですか？

ここには、問題を示す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は、好きな名前に置き換えてください。私は重宝

関連質問：

RactiveJS events on tripple mustache