問題タブ [iron-data-table]

このデモから取得した次のコードは、私のアプリで機能します。

https://saulis.github.io/iron-data-table/demo/index.html

しかし、データ ソースをiron-ajax呼び出しから内部データ バインディングに変更する{{items}}と、機能しません。

items-list.html

テーブルにデータが入力されることを期待しています。代わりに、テーブルと列のヘッダーがレンダリングされますが、データはテーブルに取り込まれません。

いくつかのポイント: Firebase を使用してデータを保存しています。そして、データpolymerfire/firebase-queryをフェッチする要素 (表示された要素の親データバインド要素内) {{items}}。

これを解決するには、どの方向に進むべきですか？

編集

items以下は、変数に設定する方法と内容を説明しています。

私の Firebase 内のデータ構造は次のとおりです。

https://console.firebase.google.com/project/my-app/database/data

親要素のPolymerfire 要素を介して、そのデータをアプリに取り込みます。firebase-query

概要-page.html

データをコンソールに記録するボタンを設定したので、{{items}}データが要素に到達していることがわかります。list-items

items-list.html

ボタンをShow押すと、コンソールに次のログが記録されます。

console.log

興味深いことに、実際のコード例について同じ情報をログに記録すると、次のようになります。

私は得る：

console.log

図に行きます。明らかに、私が理解していないことがあります。{{items}}レンダリング後にデータバインディングが登録されているように見えますがiron-data-table、何らかの理由で、データバインディングが要素iron-data-tableに登録された後に更新されていません。iron-list

編集2

要素dom-moduleの定義全体を次に示します。items-list

iron-data-tableその行の 1 つの詳細を表示および編集するために使用したいと考えています。行の詳細を main の自己完結型のサブ要素にしたいiron-data-table。この jsBin demo で示されているものと同様です。

ローカル サーバーのローカル リポジトリから実行すると、次のパターンで期待どおりの動作が得られます。

items-list.html

ただし、次のパターンでは予期しない動作が発生します。

items-list.html 行詳細.html

用紙入力の内側をクリックしてフォーカスすると、セクションが閉じるという予期しない動作が発生しますrow-detail。したがって、編集を防ぎます。

paper-inputこの変更は、要素をiron-data-table直接移動して独自のサブ要素 (現在要素と呼んでいるもの)に移動した場合にのみ発生しrow-detailます。

この問題の原因とその修正方法を誰かが提案できますか? また、この問題に対する回答が得られることを期待して、明確な質問にお答えいたします。

では、現在選択されている行iron-data-tableをクリックすると、 ( ) オブジェクトが現在 (および以前に) 選択されている行を反映することを期待します。代わりに、 になります。selected-item{{selectedItem}}null

問題を再現する手順:

1. この jsBinを開きます。
2. 任意の行を選択します。
3. 選択したオブジェクトがページの上部とコンソールに出力されることに注意してください。
4. 別の行を選択します。
5. 新しく選択された項目がページの上部とコンソールに表示されることに注意してください。
6. コンソールをクリアします。(オプション。次のステップの結果を確認するのに役立ちます。)
7. 現在選択されている行をクリックします。
8. Notice selected-item( {{selectedItem}}) オブジェクトは現在nullです。

選択したオブジェクトが新しく選択された行 (以前に選択された行) になり、null にならないようにするにはどうすればよいですか?

http://jsbin.com/xucemijada/1/edit?html,コンソール,出力

この Plunk で、x-foo要素が HELLO WORLD をレンダリングしないのはなぜですか? .

より複雑な場合、完全に正しくcontent-elインポートされているようです。iron-data-table私は単純なものを見落としていますか？ワーキングプランクで答えてください。

http://plnkr.co/edit/p7IE7v6DHLVnEggeO8PF?p=preview

これがプランクです。

iron-listたとえば、リピーターに入るデータ項目をフォーマット (または前処理) するパターン (またはなど) を教えてもらえますiron-data-tableか?

言い換えれば、例えばこのプランクを考えてみてください。各ユーザーにフィールドを追加してリストに表示したいとしましょう。どこでそれを呼びましょうnamelength:

どのように (HTML または JS のどこで、どのパターンを使用して) この前処理タスクに最も適していますか?

content-el.html

filterに属性を追加するにはどうすればよい<iron-data-tableですか? (plunk デモを投稿してください。)

私はこのプランクをフォークしました。次に、次の行を追加してフィルターを追加しようとしました。

それはプランクを壊しました。これが新しい（現在壊れている） plunkです。

ここのドキュメントでは、filter属性を次のように説明しています。

filterアイテムのフィルター処理に使用されるパス/フィルター値のペアを含む配列。

しかし、それを使用する方法の例がありません。

filterに属性を追加するにはどうすればよい<iron-data-tableですか? (plunk デモを投稿してください。)

iron-ajax から JSON データをロードした iron-data-table を使用しています。ユーザーに複数の行を選択させ、「削除」をクリックさせます。リストはバックエンドに送信され、データベースから削除されます。

ただし、フロントエンドでは、テーブルは更新されません。table.clearCache を試しましたが、役に立ちません。

続行する方法について何か考えはありますか？