我有一个“ login-imp.html”文件(聚合物1元素),用于检查登录名并获取用户名和someID。
我需要在另一个html文件(modal-imp.html)中的其他聚合物元素中检索该“ someID”。
login-imp.html
<dom-module id="login-imp">
<style>...</style>
<template>
<iron-ajax id="limp" url="SOMEURL" method="POST" handle-as="json"
content-type="application/json" with-credentials="true" on-response="_handleResponse" on-error="_handleError">
</iron-ajax>
<iron-a11y-keys keys="enter" on-keys-pressed="_logIn"></iron-a11y-keys>
<div class="login">
<paper-input value={{username}} label="[[lang.login_imp.user]]" name="username"></paper-input>
<paper-input value="{{password}}" label="[[lang.login_imp.password]]" name="password" type="password"></paper-input>
<span class="error-message">[[errorMessage]]</span>
<paper-button id="login-button" on-tap="_logIn" raised>[[lang.login_imp.signin]]</paper-button>
</div>
<paper-dialog id="modalSignUp" entry-animation="scale-up-animation" exit-animation="fade-out-animation" with-backdrop>
<modal-signup-imp id="modal-signup-view" lang="[[lang]]" config="[[config]]"></modal-signup-imp>
</paper-dialog>
</template>
<script>
Polymer({
is: 'login-imp',
properties: {
loggedIn: {
type: Boolean,
notify: true
},
profile: {
type: Object,
notify: true,
value: function () {
return {}
}
},
username: {
type: String,
notify: true,
value: ''
},
password: {
type: String,
notify: true,
value: ''
},
retailerId: {
type: String,
notify: true,
value: ''
},
config: {
type: String
},
default: {
type: Array,
notify: true
},
lang: {
type: String
},
errorMessage: String,
observers: ['_removeMessage(username, password)']
},
ready: function () {
this.addEventListener('eventFromChild', this.closeModal);
},
_logIn: function () {
Polymer.dom(this.root).querySelector("#login-button").disabled = true;
this.$.limp.body = JSON.stringify({
"username": this.username,
"password": this.password
});
this.$.limp.generateRequest();
},
_handleResponse: function (xhrResponse) {
Polymer.dom(this.root).querySelector("#login-button").disabled = false;
var message = xhrResponse.detail.response.message;
if (message == "Access granted (" + this.username + ")") {
// save profile
this.profile = xhrResponse.detail.response.user
// change status to logged in
this.loggedIn = true;
this.username = '';
this.password = '';
//THIS IS THE ID I NEED
this.retailerId = xhrResponse.detail.response.user.id_retailer;
this._removeMessage();
}
},
_handleError: function (event) {
Polymer.dom(this.root).querySelector("#login-button").disabled = false;
this.errorMessage = [
[this.lang.errors.signin]
];
this.loggedIn = false;
},
_removeMessage: function () {
this.set('errorMessage', '');
},
signup_modal: function () {
Polymer.dom(this.root).querySelector("#modal-signup-view").xhrRetailers();
var modal = Polymer.dom(this.root).querySelector("#modalSignUp");
modal.open();
},
closeModal: function () {
var modal = Polymer.dom(this.root).querySelector("#modalSignUp");
modal.close();
}
});
</script>
</dom-module>
我已经尝试了各种方法,如Polymer 1 API和文档中所述,可以从modal-imp.html访问该对象。
-html 层次结构:
login-imp.html-> main-imp.html-> index.html
modal-imp.html-> header-imp.html-> main-imp.html-> index.html
答案 0 :(得分:0)
login-imp.html文件中的代码看起来不错。您将retailerId定义为属性,并将notify设置为true。我以为没有看到您最有可能使用了错误绑定的其他文件。
要在您的示例中进行说明:
您需要做的是将retailerId发送到main-imp.html
从那里将其绑定到header-imp.html,再绑定到modal-imp.html
示例:
在您的main-imp.html
<login-imp retailer-id="{{retailerId}}"></login-imp>
重要提示:
类似问题
Maybe a similar question I have answered explaining one & two way data-binding