オランダ国立美術館の API (JSON 出力) を介して結果を取得する Polymer 要素と、特定の場所の座標を取得する要素を組み合わせました。美術館の作品には「productionPlaces」と呼ばれる項目があり、複数の値をリストで保持することができます。
このサイトは現在、アートワーク、そのメタデータの一部、制作場所 + それらの場所の座標を示しています: http://plnkr.co/edit/nbTN1kNzcqHANWECB5fI?p=preview
今、場所と座標が存在する場合にのみ表示できるようにしたいと考えています。少なくとも、"productionPlaces" が空の場合、"Production place unknown" などの短いテキストを出力する必要があります。これは自己呼び出し関数である必要があります。
関数の自己呼び出しにまだ問題があるため、現在、これまでに作成した関数を実行するためにオンクリック イベントを使用しています。また、アラート ボックスを使用して、自分が何をしているかを確認できるようにしています。
必要な場所にたどり着くための最初のステップは、関数を取得して、すべてのオブジェクト内のすべての「productionPlaces」リスト項目の値を実際にチェックすることです。
これまでのところ、これを行うための現在の機能は次のとおりです。
checkPlace: function() {
y = 1
x = 0
var place = this.object.artObjects[y].productionPlaces[x];
alert (place)
アラート ボックスに「Zuid-Holland」が表示されます。これは、2 番目のオブジェクト (y=1) の最初の productionPlace (x=0) です。したがって、関数は機能します。
ただし、最終目標 (上記で説明) に到達するには、関数が API の結果から値 "x" と "y" を自動的に認識する必要があります。私はすでに「y」を始めています。しかし、私は成功していません.アラートボックスがポップアップしなくなったため、次の「ボタン+機能」の構築は失敗しています:
<button on-click="{{checkPlace}}" objIndex="{{objIndex}}"></button>
checkPlace: function(s) {
var place = this.object.artObjects[s.getAttribute('objIndex')].productionPlaces[0];
alert (place)
現在の Template-Bind と Template-repeat では、{{objIndex}} を介して各オブジェクトのインデックス番号を表示できるはずですが、これはうまく機能しているようです。では、なぜ私の「ボタン + 機能」構造が警告ボックスに目に見える結果をもたらさないのでしょうか?