[英]dom-if does not update according to the condition
I'm trying to build a simple login system and I have 2 different templates in it: One when the user is not logged in yet (which displays a "sign in" button), and one when the user is logged in (which displays the username) 我正在尝试构建一个简单的登录系统,并且其中有2个不同的模板:一个在用户尚未登录时(显示“登录”按钮),一个在用户登录时(显示)。用户名)
By default, the first one is displayed. 默认情况下,显示第一个。 But when the user is logged in, my first template is not destroyed and my second template is not displayed.
但是,当用户登录时,我的第一个模板没有被破坏,我的第二个模板也没有显示。
<template is="dom-if" if="{{!logged}}" restamp="true">
<div class="box" id="notLogged">
<paper-button class="loginButton" on-tap="loginPopup"><iron-icon class="avatar" icon="account-circle"></iron-icon><span id="notLoggedMessage">Sign in</span></paper-button>
</div>
</template>
<template is="dom-if" if="{{logged}}" restamp="true">
<div class="box" id="logged">
<paper-button class="loginButton" on-tap="logoutPopup">
<img src="https://placehold.it/40x40" alt="user avatar" />
</paper-button>
</div>
</template>
and now the script. 现在是脚本。 As you can see, I don't use any ajax yet because the service is not done yet.
如您所见,我尚未使用任何Ajax,因为该服务尚未完成。 So I'm faking it with "loginOk" value
所以我用“ loginOk”的值来伪造它
Polymer({
is: 'system-login',
properties: {
logged: {
type: Boolean,
value: false}
},
loginPopup: function (e) {
loginWindow.open();
},
logoutPopup: function (e) {
logoutWindow.open();
},
checkLogin: function () {
var loginOk = 1;
if (loginOk === 1) {
this.logged === true;
loginWindow.close();
} else if (loginOk === 2) {
errorMessage.style.display = "inline";
} else {
return;
}
}
});
The problem is this.logged === true;
问题是
this.logged === true;
. 。
===
in JavaScript is a comparison operator and not an assignment operator. JavaScript中的
===
是比较运算符,而不是赋值运算符。 So what your code does is it compares the value and type of this.true
with Boolean true
and returns false (which you are not catching). 因此,您的代码执行的操作是将
this.true
的值和类型与Boolean true
进行比较,并返回false(您未捕获)。
Changing it to this.logged = true
should do the trick 将其更改为
this.logged = true
应该可以解决问题
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.