Question

我有一个包含开关和屈服形式的组件。开关更改用于生成表单的模型。在上述表格中，我有一个textarea，其值来自模型。当我更新组件中的模型时，textarea会弯曲到正确的模型，但其中的值不会更新。我无法弄清楚如何做到这一点

我使用的是Ember 1.13。

这是我的组件：

import Ember from 'ember';

const { computed } = Ember;

export default Ember.Component.extend({
  // Properties
  switchField: null,
  defaultModel: null,
  specificModel: null,

  activeModel: computed('switchField', 'defaultModel', 'specificModel', function() {
    if (this.get('switchField')) {
      return this.get('defaultModel');
    } else {
      return this.get('specificModel');
    }
  }),

  editDisabled: computed('switchField', function() {
    if (this.get('switchField')) {
      return true;
    } else {
      return false;
    }
  }),

  renderSwitch: function() {
    Ember.run.schedule('afterRender', this, function() {
      $('.toggle-switch').bootstrapToggle();
    });
  }.on('init'),

  actions: {
    reflectChange: function(value) {
      this.set('switchField', value);
      this.rerender();
    }
  }
});

模板：

<div class="col-xs-12">
  <input data-toggle="toggle" data-onstyle="success" data-offstyle="danger" class="toggle-switch" type="checkbox" checked={{switchField}} onchange={{action "reflectChange" value="target.checked"}} />
  <br>
  <br>
</div>

{{ yield activeModel editDisabled }}

以及如何使用它：

{{#inherit-switch switchField=warehouse.companyInheritance.inheritCarrierProcedure defaultModel=company specificModel=warehouse as |activeModel editDisabled|}}
  <div class="col-xs-12">
    {{#form-group value=activeModel.errors.carrierProcedure }}
      <label class="control-label" for="carrierProcedure">Procédure coursier</label>
      {{textarea class="form-control" id="carrierProcedure" value=activeModel.carrierProcedure disabled=editDisabled}}
    {{/form-group}}
  </div>
{{/inherit-switch}}

我尝试rerender组件，但它不起作用。我不明白为什么在切换开关时，textarea被正确启用/禁用后，值不会发生变化。

感谢您的帮助。

更新Emberjs中的textarea模型

0 个答案: