Question

我是EmberJS的初学者，在选择其他字段中的选项后尝试启用/禁用输入文本字段时遇到了一些麻烦。

我的问题是，我有三种不同的模式：员工，银行详细信息和银行。并且我使用包含银行列表的选择选项列表为员工模型制作表单，并且在选择银行选项后，必须启用与银行详细信息模型相关的字段（代理商和帐号）。

问题是，如何动态启用/禁用输入文本字段，在用户选择银行列表中的选项后启用还是禁用？

这是我的代码：

员工模型：

App.Employee = DS.Model.extend({
  attr fields(),
  bank_detail: belongsTo('bank_detail')
});

银行模式：

App.Bank = DS.Model.extend({
  number:  attr(),
  name:    attr(),   
  fullName: function() {
    return this.get('number') + ' - ' + this.get('name');
  }.property('number', 'name'),
  bank_details:  hasMany('bank_detail')
});

银行明细模型：

App.BankDetail = DS.Model.extend({
  agency:           attr(),
  agency_dv:        attr(),
  account_number:   attr(),
  account_dv:       attr(),
  employee_id:  belongsTo('employee'),
  bank:         belongsTo('bank')
});

=============================================== =====================

员工控制员：

App.EmployeesFormController = Ember.ObjectController.extend({
  bankList: function() {
    return this.get('store').find('bank');
  }.property(),      
  hasBank: function() {
    return this.get('bank_id') != null;
  }.property(),  
  actions: {
    save: function(employee) {
      employee
        .save()
        .then(this.get('success').bind(this))
        .catch(this.get('fail').bind(this));
    }
  }
});

=============================================== =========

员工模板/表单组：

{{#form-group label="<%= I18n.t('active_record.models.bank') %>"
              for="employee-bank"}}
  {{view Ember.Select id="employee-bank"
                      content=bankList
                      optionValuePath="content.id"
                      optionLabelPath="content.fullName"
                      prompt="Select a bank name..."
                      selection=bank}}
{{/form-group}}
{{#form-group label="<%= I18n.t('active_record.attributes.employee.bank_details.agency') %>"
              for="employee-bank-detail-agency"}}
  {{#if hasBank}}
    {{input value=bank_detail.agency disabled=false id="employee-bank-detail-agency"}}
  {{#else}}
    {{input value=bank_detail.agency disabled=true id="employee-bank-detail-agency"}}
  {{/if}}
{{/form-group}}
{{#form-group label="<%= I18n.t('active_record.attributes.employee.bank_details.account_number') %>"
              for="employee-bank-detail-account"}}
  {{#if hasBank}}
    {{input value=bank_detail.account_number disabled=false id="employee-bank-detail-account-number"}}
  {{#else}}
    {{input value=bank_detail.account_number disabled=true id="employee-bank-detail-account-number"}}
  {{/if}}
{{/form-group}}

Answer 1

您可以在模板或视图中为输入设置禁用绑定。例如：

{{input type="checkbox" checked=isChecked}}
{{input type="text" disabled=isChecked}}

演示：http://emberjs.jsbin.com/qegequsazepe/1/

使用EmberJS选择选项列表项后如何启用/禁用输入字段？

1 个答案: