Как написать составной вызов AJAX в полимере

Я пытаюсь написать компонент, который предоставляет данные из вызова AJAX в Polymer. Я хотел бы закончить чем-то вроде.

<get-db data={{data}}></get-db>

<template is="dom-repeat" items="{{data}}">
    <div>{{item}}</div>
</template>

Тем не менее, когда я выставляю data собственность от get-db компонент в другом элементе, данные не привязываются к dom-repeat шаблон.

Компоненты get-db:

<iron-ajax id="ajax"
  url="https://api/endpoint"
  method="post"
  handle-as="json"
  content-type="application/json"
  body="[[request]]"
  last-response="{{response}}"></iron-ajax>

...

  static get properties() {
    return {

      response: Object,

      request: Object,

      username: String,

      data: Object

    }
  }

  getResponse() {
    if (this.username && this.apiKey) {
      this.request = {
        "body": "bodyText"
      };
      let request = this.$.ajax.generateRequest();
      request.completes.then(req => {
        this.setResponse();
      })
      .catch(rejected => {
        console.log(rejected.request);
        console.log(rejected.error);
      })
    }
  }

  setResponse() {
    if(this.response[0]) {
      this.data = this.response[0];
    }
  }

2 ответа

Свойство данных должно быть установлено для уведомления.

 data: {
   type: Object,
   notify: true
 }

Вы должны добавить уведомление, но также вы должны использовать this.set метод для того, чтобы получить наблюдаемые изменения для data свойства. Также вы устанавливаете только один элемент data свойства (при условии, что у вас есть массив в response Свойства.) Я думаю, вам нужен весь массив, а не только 0. index как вы повторяете в дом-повтор. Вот почему этот код может помочь:

static get properties() {
    return {

      response:{
         type:Object,
         observer:'checkResponce'},

      request: Object,

      username: String,

      data: {
         type:Array,
         notify:true}

    }
  }
 static get observers() { return [ 'checkUserNApi(username,apiKey)']}

  checkUserNApi(u,a){
      if (u && a) this.$.ajax.generateRequest();
  }
  checkResponce(d) {
      if (d) {
          this.set('data',d); //with this method data property at parent will change upon you received responce
      }  
  }

Наконец, вы можете добавить к iron-ajax линия check error on-error="{{error}}" если вы хотите увидеть сообщение об ошибке.

DEMO

Другие вопросы по тегам