[英]Ember.js - Fading in an if statement
我想顺利淡出一个字段的错误,我有一些问题要弄清楚Ember.js的流程。 目前,错误范围弹出并弹出而没有任何效果。 我的索引模板看起来像这样。
<script type="text/x-handlebars" data-template-name="index">
<div class="errorbox">
{{#if error }}
<span class="error">
{{ error }}
</span>
{{/if}}
</div>
<label>What is your name?</label>
{{input type="text" action="type" value=username }}
</script>
和我的控制器:
App.IndexController = Ember.ObjectController.extend({
actions: {
type: function() {
if (this.get('username').length > 10) this.set('error', 'Username beyond length!');
else this.set('error', null);
}
},
/* properties */
error: false,
username: false
});
有一个简单的方法吗?
一种简单的方法是使用CSS动画来实现效果:
.error {
-webkit-animation: fadeIn 1s ease;
animation: fadeIn 1s ease;
}
@-webkit-keyframes { from { opacity: 0.0 } to { opacity: 1.0 } }
@keyframes { from { opacity: 0.0 } to { opacity: 1.0 } }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.