Polymer 2.0 - Wie nutze ich die Eisen-ajax?
Ich versuche mich zu binden lokale properties.json und versuchen, erstellen Sie dynamische Elemente, aber das problem ist ich bekomme keine Konsole Fehler und nicht zu sehen, JSON, in die UI.
Ich nicht eine Polymer-2.0-Beispiel für die Verwendung <iron-ajax>, aber ich fand diejenigen, die für die Polymer-1.0 nur.
Hier ist der code, den ich versucht habe:
polymer-input.html
<link rel="import" href="https://www.polymer-project.org/0.5/components/polymer/polymer-element.html">
<link rel="import" href="https://www.polymer-project.org/0.5/components/iron-ajax/iron-ajax.html">
<dom-module id="polymer-app">
<template>
<style>
:host {
display: block;
}
</style>
<iron-ajax auto="" url="properties.json" handle-as="json" last-response="{{ajaxResponse}}"></iron-ajax>
<template is="dom-repeat" items="[[ajaxResponse]]">
<span>[[item.name]]</span>
</template>
<h2>Hello [[prop1]]!..[[ajaxResponse]]</h2>
</template>
<script>
/**
* @customElement
* @polymer
*/
class PolymerApp extends Polymer.Element {
static get is() { return 'polymer-app'; }
static get properties() {
return {
prop1: {
type: String,
value: 'polymer-app'
}
};
}
}
window.customElements.define(PolymerApp.is, PolymerApp);
</script>
</dom-module>index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
<title>polymer</title>
<meta name="description" content="custom ele">
<script src="https://www.polymer-project.org/0.5/components/webcomponentsjs/webcomponents-loader.js"></script>
<link rel="import" href="polymer-app/polymer-app.html">
<link rel="import" href="polymer-input/polymer-input.html">
</head>
<body>
<polymer-app></polymer-app>
</body>
</html>Eigenschaften.json:
{
{
name:"Name",
type:"string",
size:20
},
{
name:"Age",
type:"number",
size:20
}
}Bin ich immer unten-Ausgang statt der Eigenschaften von json-Daten
autoist ein flag-Attribut, genauso wiehidden, so entfernen Sie die=""nach. Auch, sehen Sie, dass die Datei empfangen wurde, in das Entwickler-tool unter der Registerkarte "Netzwerk"? Andere als die, ist alles was ich tun kann, ist geben Ihnen einen upvote, weil ich habe das gleiche problem und keine Ahnung wie damit umzugehen.- Die drei URLs beginnend mit polymer-project.org/0.5 sind 404. Und 0,5 ist auch nicht Polymer 1.0. Sie sind Recht unterschiedlich und nicht kompatibel.
Schreibe einen Kommentar
Du musst angemeldet sein, um einen Kommentar abzugeben.
Das erste problem ist die demo verwendet eine Basis-URL für die Polymer-0.5, während Sie Ihren code mithilfe von Polymer-2.0-syntax.
Das ist dieser code:
...sollte so etwas wie dieses:
Zweite, Ihre
properties.jsonDatei enthält ungültiges JSON. Es sieht aus wie Sie, gedacht, um mit den eckigen Klammern für die array-Daten; und Ihre Schlüssel fehlen Anführungszeichen. Sie werden bemerken, dass die Ausführung der Datei-Inhalt durchJSON.parse()würde einen Fehler auslösen.Dieser text:
...sollte so etwas wie dieses:
Dritten, beachten Sie, dass
<iron-ajax>stellt automatisch<Eisen-ajax>.lastResponsezunullwenn<Eisen-ajax>.handleAsistjson- und die Antwort kann nicht analysiert werden, wie JSON. In Ihrem Fall, die ungültige JSON inproperties.jsonverursachen würdelastResponsefestgelegt werden, umnullverhindert, dass Ihre Beispiel vom Rendern die dafür vorgesehenen Felder ein.Hier ist eine funktionierende Polymer, 2
<iron-ajax>demo (mit deinem Beispiel code) mit allen Korrekturen:http://plnkr.co/edit/2mpJd1b0UF5FqAr2BOxL?p=preview