所以我将auth
课程注入我的main.js
:
import {Auth} from 'auth';
import {inject} from 'aurelia-framework';
@inject(Auth)
export class App {
constructor(auth) {
this.auth = auth;
}
get isLoggedIn() { return this.auth.isLoggedIn; }
}
所以在我的app.html
<form>
<!-- form login elements -->
</form>
如何根据我的app getter函数有条件地显示此元素。
答案 0 :(得分:30)
您可以使用if.bind有条件地绑定DOM元素。
<form>
<div if.bind="auth.isLoggedIn">
<!--this DOM element will be bind only if auth.isLoggedIn is true-->
</div>
</form>
或者,您也可以使用show.bind,但这只会隐藏您的DOM元素。 if.bind不会在你的页面上呈现它。
答案 1 :(得分:5)
如果你需要在不满足条件的情况下完全从标记中删除元素,你可以使用<template>
<div if.bind="auth.isLoggedIn">
<!--this DOM element will be bind only if auth.isLoggedIn is true-->
</div>
</template>
(正如@Pratik Gajjar回答的那样):
display: none
如果您需要在元素上有条件地设置show.bind
,则可以使用<template>
<div show.bind="auth.isLoggedIn">
<!--this DOM element will be shown only if auth.isLoggedIn is true-->
</div>
</template>
:
gsub('-n$','', 'my_word-n')
[1] "my_word"
#to make this work for the whole data frame you can do
my_new_df <- sapply(my_old_df, function(x) gsub('-n$','', x))
有关详细信息,请查看http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/cheat-sheet/6。
答案 2 :(得分:1)
所以我创建了一个值转换器:
export class CssdisplayValueConverter {
toView(value) {
return value ? 'none' : 'display';
}
}
然后在我的app.html中:
<require from='css-display'></require>
<form css="display: ${isLoggedIn() | cssdisplay}"></form>
砰的一声,完成了。
答案 3 :(得分:1)
您可以使用if.bind
和show.bind
通过检查条件来绑定元素