问题描述
我对Ember是相当新的(使用版本0.2.3)。我有一个具有几个计算值的组件。他们从输入字段中收集这些计算值:c code $ c可以在组件中更新, / div>是的,所以Ember没有内置支持单选按钮。尝试制作自己的组件!而且,让自己的意思是无耻的从窃取。
从ember导入Ember;
导出默认值Ember.Component.extend({
tagName:'input',
type:'radio',
attributeBindings:['type','htmlChecked :check','value','name','disabled'],
htmlChecked:function(){
return this.get('value')=== this.get ('checked');
} .property('value','checked'),
更改:function(){
this.set('checked' .get('value'));
},
_updateElementValue:function(){
Ember.run.next(this,function(){
this 。$()。prop('checked',this.get('htmlChecked'));
});
} .observes('htmlChecked')
});
在组件中,单选按钮仍然有值,但选择的绑定是传递的在检查的属性中:
是{{radio-button value ='1'checked = choice}}
否{ {radio-button value ='0'checked = choice}}
I am fairly new to Ember (using version 0.2.3). I have a component with a few computed values. They gather these computed values from input fields:
export default Component.extend({ loanAmount : 200000, deductible : 0, debtInt : 5, getLoanCosts: computed('loanAmount', 'debtInt', function(){ return (get(this, 'debtInt')/12) * get(this, 'loanAmount'); })On my template.hbs, I have an input field {{ input value=loanAmount }} and I can call {{getLoanCosts}} in my template.hbs, to show the computed cost. This works great for text/number inputs.
However, I need to have a radio button input with two values (Yes and No). This should line up with the deductible value in my component (i.e. is this loan deductible?). However, if I do:
Yes {{ input type="radio" name="deductible" value=deductible }} No {{ input type="radio" name="deductible" value=deductible }}I can't set values for these two inputs, like I can with straight HTML. If I set value=0 and value=1, they never update in my component. How can I update my deductible in the component based on whether Yes or No is selected?
解决方案Yeah so Ember doesn't have built in support for a radio button. Try making your own component! And by make your own I mean shameless steal one from the internet.
import Ember from 'ember'; export default Ember.Component.extend({ tagName: 'input', type: 'radio', attributeBindings: ['type', 'htmlChecked:checked', 'value', 'name', 'disabled'], htmlChecked: function() { return this.get('value') === this.get('checked'); }.property('value', 'checked'), change: function() { this.set('checked', this.get('value')); }, _updateElementValue: function() { Ember.run.next(this, function() { this.$().prop('checked', this.get('htmlChecked')); }); }.observes('htmlChecked') });And in component, the radio buttons still have values, but the binding of the selection is to the passed in checked property:
Yes{{radio-button value='1' checked=choice}} No{{radio-button value='0' checked=choice}}
这篇关于记录废物中单选按钮的值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!