以编程方式更改当前位置

Question

如何以编程方式更改当前位置？

app-location位于父元素上，我希望从子元素中更改它。

这是家长的节选

dom-module(id='test', assetpath='/')
    template
        app-location(route='{{route}}')
        app-route(route='{{route}}', pattern='/:page', data='{{rootData}}', tail='{{rootTail}}')
        ...
        login-page(name='login', route='[[rootTail]]')
        ...
    script.
        Polymer({is: 'test');

还有孩子

dom-module(id='login-page')
    template
        div(class='layout horizontal center-justified mh400')
            div(class='layout vertical center-justified')
                form(is='iron-form', id='login-form', method='post', action='/api/auth/login', on-iron-form-response='onResponse')
                    ...
    script.
        Polymer({
            is: 'login-page',
            onResponse: function (event) {
                var resp = event.detail.response;

                if (resp.success) {
                    // Change here the location
                }
            }
        })

对不起，不是html，而是Jade，但是给我理解我的想法。

Answer 1

app-location只需与浏览器的地址栏进行接口。它在内部使用iron-location。没有什么能阻止您将它包含在子元素中。这里的角色是更新地址栏(而不是监听更改)。在JavaScript中，选择元素并更新其path。

父元素中的app-location将检测地址栏中的更改并更新route。

dom-module(id='login-page')
    template
        app-location
        div(class='layout horizontal center-justified mh400')
            div(class='layout vertical center-justified')
                form(is='iron-form', id='login-form', method='post', action='/api/auth/login', on-iron-form-response='onResponse')
                    ...
    script.
        Polymer({
            is: 'login-page',
            onResponse: function (event) {
                var resp = event.detail.response;

                if (resp.success) {
                    // TODO: Update with your new path
                    this.shadowRoot.querySelector('app-location').path = '';
                }
            }
        })