Question

我在概念上陷入困境。我已经创建了一个构建器组件，用于通过AJAX帖子管理数据输入。返回时，我将拥有一个可以呈现给客户端的JSON对象。最理想的情况是，我想实例化一个新的渲染组件，将JSON对象传递给它，然后销毁构建器组件（第二个门是一个简单的页面重新加载，但这对于21世纪来说似乎是一个20世纪90年代的锤子钉）。

代表（简化）构建器组件：

<link rel="import" href="/bower_components/polymer/polymer.html">
<link rel="import" href="/bower_components/core-ajax/core-ajax.html">

<polymer-element name="post-builder" attributes="accesstoken">
    <template>
        <core-ajax id="poster" url="api_call" handleAs="json"></core-ajax>
        <textarea class="form-control" rows="4" placeholder="Enter text here." value="{{ body }}"></textarea>
        <div class="postControls">
            <div class="sendLink">
                <a href="javascript:null;" on-click="[[ postAndReplaceTile ]]">Post</a>
            </div>
        </div>
    </template>
    <script>
        created: function(){
            this.body = '';
        },
        ready: function(){

        },
        postAndReplaceTile: function(){
            data = {body : this.body, publish : true};

            var ajax = this.$.poster;
            ajax.removeEventListener('core-response');

            ajax.method = 'POST';
            ajax.contentType = 'application/json';
            ajax.params = { access_token: this.accesstoken };
            ajax.body = JSON.stringify(data);
            ajax.addEventListener('core-response', function(){
                if(this.response.hasOwnProperty('post')){
                    if(this.response.post.hasOwnProperty('id')){

                        // valid JSON object of the new post

                    }
                }
            }); 
            ajax.go();


        }
    });
    </script>
</polymer-element>

在有效JSON对象的阶段，我正在寻找jQuery的替换with（）的道德等价物......认识到JSON对象在被替换的组件中所以我需要仔细排序这些事件。有没有办法干净地达到父DOM并进行这些类型的转换？

Answer 1

您可以使用parentNode.host（请参阅here）来访问容器元素并使用DOM方法替换元素，但这样会以某种方式反模式并破坏封装（见here和here）。

最好使用events并让容器元素负责交换元素。

有没有办法将一种聚合物组分换成另一种？

1 个答案: