0

Dart を使用してデータから HTML5 テーブルを作成するさまざまな方法を試しています。私は次のものを持っています:

<table id="sitelist">
  <thead>
    <tr><th>Select a site</th>
      </tr>
    </thead>
  <tbody template iterate="x in siteCells">
    <tr on-click="displaySite('{{x[0]}}')"> <td> {{x[1]}} </td>
      </tr> 
    </tbody>
  </table>

アイデアは、サイト ID をパラメーターとして受け取るオンクリック ハンドラーを 1 つ持つことです。ただし、displaySite へのパラメーターが正しく設定されていません。この関数はリテラル文字列を受け取ります{{x[1]}}
サイト名x[1]が正しく表示されます。

私の質問は次のとおりです: {{}} 置換をオン クリック ハンドラのパラメータ リスト内で機能させることは可能ですか?

4

2 に答える 2

1

セスの有用な反応の前に、私は別のアプローチを思いついた。これは、テーブルレベルで単一のon-clickイベントを使用し、行にdata-id属性を追加します。どのアプローチが優れているか、または私が使用すべきより標準的な「ダートフル」アプローチがある場合は、コメントをいただければ幸いです。

  <template if="showSiteList == true">
    <table class="table-select" id="sitelist2" on-click="tableClicked($event)">
      <thead>
        <tr><th>Choose a site</th>
          </tr>
        </thead>
        <tbody template iterate="x in siteCells">
          <tr data-id={{x[0]}} > <td> {{x[1]}} </td>
            </tr> 
          </tbody>
      </table>  
    </template>

そしてダートコード:

void tableClicked(Event e) {
 TableCellElement cell = e.target;
 TableRowElement row = cell.parent; 
 if (row.dataAttributes.containsKey('id')) {
   int id = int.parse(row.dataAttributes['id']);
   if (id != null) { // be a bit paranoid
      globSiteId = id;
   }   
 }
 showSiteList = false;
 watchers.dispatch();
}
于 2012-12-19T07:56:01.387 に答える
1

{{ }}オンクリックで displaySite() 呼び出しから削除するだけで機能します。

<table id="sitelist">
  <thead>
    <tr><th>Select a site</th>
    </tr>
  </thead>
  <tbody template iterate="x in siteCells">
    <tr on-click="displaySite(x[0])"> <td> {{x[1]}} </td>
    </tr>
  </tbody>
</table>

それが役立つことを願っています!

于 2012-12-19T04:22:10.167 に答える