如何在 ajax 请求中改变 Polymer v1.x 属性

Question

我试图根据我通过 iron-ajax 从 Ajax 请求中获取的结果填充一个数组当我尝试访问我的属性时，我的手表 window 显示 "not available"

下面是我重新创建的一个小例子来解释我的问题：

我的-component.html

<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/iron-ajax/iron-ajax.html">
<link rel="import" href="../../bower_components/app-storage/app-localstorage/app-localstorage-document.html">
<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">


<dom-module id="my-component">
    <template>
        <div>
            <paper-dropdown-menu
                    id="location" label="Ubicaci&oacute;n"
                    value="{{vehicle.location}}">
            </paper-dropdown-menu>
            <paper-dropdown-menu id="city" label="Ciudad">
                <paper-menu
                        class="dropdown-content"
                        selected="{{city.city_code}}"
                        attr-for-selected="value"
                        on-iron-select="estadoSeleccionado">
                    <template id="" is="dom-repeat" items="[[opcionesDisponibilidad]]" as="i">
                        <paper-item value="[[i.valor]]">[[i.texto]]</paper-item>
                    </template>
                </paper-menu>
            </paper-dropdown-menu>
        </div>
        <iron-ajax
                id="ajax"
                method="GET"
                url="http://localhost:8080/ws.asmx"
                params=""
                content-type="application/x-www-form-urlencoded; charset=UTF-8"
                handle-as="text"
                on-response="handlecities"
                debounce-duration="300">
        </iron-ajax>
        <app-localstorage-document id="localStorageElement" key="myapp.login_data" data="{{loginInfo}}"></app-localstorage-document>
    </template>
    <script>
        Polymer({
            is: "my-component",
            properties:{
                vehicle: {
                    type: Object,
                    value:{
                        id: "",
                        plate: "",
                        location: ""
                    }
                },
                cities:{
                    notify: true,
                    type: Array,
                    value: [{city_code:'0', city_name:'-'}]
                }
            },
            ready:function () {
                this.querycities();
            },
            querycities: function () {
                if (this.$.localStorageElement.storage['myapp.login_data']){
                    this.$.loginInfo = JSON.parse(this.$.localStorageElement.storage['myapp.login_data']);
                } else return false;
                this.$.ajax.url = this.$.ajax.url + "/listadoCiudades";
                this.$.ajax.verbose = true;
                this.$.ajax._boundHandleResponse = this.handlecities;
                this.$.ajax.params = {dispositivo:'12345', credencial: this.$.loginInfo.cred};
                this.$.ajax.generateRequest();
            },
            handlecities: function (request) {
                console.log(request.response);
                var xPath = new SoftXpath();
                xPath.registerNamespace("","");
                xPath.loadXML(request.response);
                var cities = xPath.selectNodes("//Ciudad//*[self::Codigo|self::Nombre]");
                var xPathElement = new SoftXpath();
                if (cities){
                    for(var i = 1; i < cities.length;i++){
                        var c = new Object();
                        c.Codigo = cities[i-1].text;
                        c.Nombre = cities[i].text;

                        this.$.cities.push(c);// <---- Here I have not access to my polymer property ' cities '.

                        //How to update my polymer var cities ??
                        //Tried also with:
                        // this.cities --> undefined
                        // this.$$('#myassignedId').cities  --> undefined
                    }
                }
            }
        })
    </script>
</dom-module>

如果超出范围，我该如何填充 'cities' 属性？

Answer 1

嗯，经过多次尝试错误的变化，终于找到了错误的原因。

第 65 行：

this.$.ajax._boundHandleResponse = this.handlecities;

删除那条线，我所有的聚合物属性都恢复正常。

我使用那句话是因为我试图为多个 ajax 请求重用该组件。 'handlecities' 也被指定为属性，因此是多余的（仅当没有重用意图时）。我仍然不知道如何重用定义自定义处理程序的组件，但出于某种原因，如果我使用上面的句子，所有聚合物属性都会丢失。

因此，与此同时，我定义了几个 ajax 组件，每个组件对应一个 ajax 请求

如何在 ajax 请求中改变 Polymer v1.x 属性

How to mutate Polymer v1.x property inside ajax request

javascript

polymer

polymer-1.0