2012-02-13 5 views
0

を渡していないクリックします。jQueryのTMPL knockout.js私はシンプルなテンプレートブロックを持っているアイテム

<script id="selectedCust" type="text/x-jquery-tmpl"> 
{{each people}} 
<div class="section" personid="${Personid}" > 
    <div class="sectionActions"> 
     <div> 
      <a class="action" href="#" data-bind='click: removePerson'>Remove</a> 
     </div> 
    </div> 
</div> 
{{/each}} 
</script> 

シンプルなHTMLブロック:ノックアウトJSと

<div id="customersArea" data-bind="template: 'selectedCust'"> 
</div> 

function viewModel() { 
      var self = this; 
      self.people = ko.observableArray(); 
      self.removePerson = function (person, ev) { 
       self.people.remove(person); 
      }; 
      self.setPeople = function (ppl) { 
       var len = ppl.length; 
       for (var i = 0; i < len; i++) { 
        this.people.push(ppl[i]); 
       } 
      }; 
     } 

    var mainViewModel = new viewModel(); 
    ko.applyBindings(mainViewModel, $("#customersArea")[0]); 

を私ができます人々を設定し、データバインディングを見てください。ただし、removePersonがpersonパラメータと呼ばれるときは常にmainViewModelであり、決してinstanではありませんce。私が$ root.removeを試してみると、同じ結果が得られます。$ parent.removeを試してみると、$ parentを取得できません。

evパラメータに頼らずに何が間違っているのですか?

(順番に)含まれ、#selectedCustブロックは、この後であってもよく、または右knockout.jsと$親にそれはまだエラーが出た後の追加:

<script src="/Scripts/jquery-1.7.1.js" type="text/javascript"></script> 
<script src="/Scripts/modernizr-2.0.6-development-only.js" type="text/javascript"></script> 
<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script> 
<script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script> 
<script src="/Scripts/jQuery.tmpl.min.js" type="text/javascript"></script> 
<script src="/Scripts/knockout-2.0.0.js" type="text/javascript"></script> 
<script src="/Scripts/jquery-ui-1.8.16.min.js" type="text/javascript"></script> 
<script src="/Scripts/jquery-blockUI.js" type="text/javascript"></script> 

私はちょうどko.jsのテンプレートにそれを変更:

<div class="section" data-bind="attr: { 'personid': PersonId }" > 
    <div class="sectionActions"> 
     <div><a class="action" href="#" data-bind='click: $parent.removePerson'>Remove</a></div> 
    </div> 
</div> 

これは問題ですか?これはtmplを使用したノックアウトの問題ですか?

答えて

1

これを試しましたか?

<div><a class="action" href="#" data-bind='click: $parent.removePerson'>Remove</a></div> 

ノックアウトのドキュメント「注1」に従って、ループ中に$ parentを付ける必要があります。 Link

EDIT はところで私はここにこれを共有する考え出し:

「2011年12月のとして、jQuery.tmplが活発に開発中もはやである、ということに注意していないしてくださいやがて、それがsuccededされます。 JsRenderはまだベータ版ではない」 LINK

+0

私はこれを試して、「Uncaught ReferenceError:$ parentが定義されていません」と表示されます – maxfridbe

+0

あなたはJavaScriptを含むことができますか? – Etch

+0

が追加されました。 – maxfridbe

0

右の1つの問題は、クラス「セクション」のdivがクローズする「div」タグがないことです。私はこれがDOMの不正なオブジェクトを作成していると思われます。

+0

申し訳ありません、コピー貼り付けエラーです。 – maxfridbe

関連する問題