0

再利用するカスタム要素を作成しようとしています。私が持っているのは、クリックしたリンクに応じて、それぞれのページに表示される 3 つの属性で構成されるデータです。

ポリマー スターター キットを使用しています。基本的には、URLによって変化する情報のページが欲しいです。ページにプログラムのリストがあり、それぞれのページへのリンクがあります。これまでのところ、私はこれを持っています：

私の index.html には、次のようなセクションがあります。

<section data-route="programs">
<paper-material elevation="1">
<h1>Programs</h1>
<a href$="{{baseUrl}}programs/firstprogram">Program 1</a></br>
<a href$="{{baseUrl}}programs/secondprogram">Program 2</a></br>
<a href$="{{baseUrl}}programs/thirdprogram">Program 3</a></br>
</paper-material>
</section>

次に、次のようなカスタム要素、program-info があります。

<dom-module id="program-info">
  <template>
    <h2 class="page-title">{{program.name}}</h2>
    <p>{{program.price}}</p>
    <p>{{program.description}}</p>
  </template>
  <script>
    (function() {
      'use strict';
      Polymer({
        is: 'program-info'
      });
    })();
  </script>
</dom-module>

クリックされたプログラムに基づいて、データを取得し、カスタム要素 (名前、価格、説明) で使用したいと考えています。プログラムが7つしかないので配列に入れることを考えましたが、URLに基​​づいて配列内の適切なアイテムを取得する方法がわかりません。

何かご意見は？

4

1 に答える 1

1

実際に PSK を使用している場合は、 のセクション/ページuser-infoを参照してくださいapp/index.html。URL から取得した名前に基づいて、ユーザーに関する情報を表示します。

もちろんapp/elements/routing.html、URL から名前を取得してparams変数に設定する方法を理解するために、ルーティング構成も確認する必要があります。

次に、必要に応じてルートを追加/変更するprograms必要があります。

編集：

このサンプル アプリでも同様のアプローチを見ることができます。ルートが変更されたときにデータがフェッチされ、要素のスコープ内のプロパティに設定されます。この要素では、前述のプロパティ自体が、以前にネットワーク経由でフェッチされた記事のコンテンツの表示を担当する「ページ要素」の同様の名前のプロパティにバインドされています。articleblog-apparticlearticle-detail

于 2016-04-03T09:27:19.873 に答える