Question

我想在input元素中添加data-value属性：

{{input type="text" data-value=ec.ec_id  value=ec.ecl_subject placeholder=ec.ecl_en_subject name="ecl_subject"  class="form-control" }}

但它在浏览器中不可见：

<input id="ember874" class="ember-view ember-text-field form-control" placeholder="Doctor4US: Appointment" type="text" name="ecl_subject">

Answer 1

添加数据属性

默认情况下，视图助手不接受数据属性

即。

{{input type="text" data-value=ec.ec_id  value=ec.ecl_subject name="ecl_subject" }}

渲染为

<input id="ember257" class="ember-view ember-text-field" type="text" value="12">

有两种方法可以启用对数据属性的支持。单程将在视图上添加属性绑定，例如Ember.TextField用于特定属性：

Ember.TextField.reopen({
  attributeBindings: ['data-value']
});

现在上面相同的把手代码会呈现以下HTML：

<input id="ember259" class="ember-view ember-text-field" 
       type="text" data-value="110" value="12">

您还可以使用以下内容自动将基本视图上的数据属性绑定：

Ember.View.reopen({
  init: function() {
    this._super();
    var self = this;

    // bind attributes beginning with 'data-'
    Em.keys(this).forEach(function(key) {
      if (key.substr(0, 5) === 'data-') {
        self.get('attributeBindings').pushObject(key);
      }
    });
  }
});

有关详情，请访问：https://guides.emberjs.com/v1.10.0/templates/binding-element-attributes/

Answer 2

Ember输入助手不允许数据属性。允许的属性列表可以在https://guides.emberjs.com/v2.6.0/templates/input-helpers/

找到

问题的解决方案是当你想要放置如下所示的数据属性时，你自己使用html标签

<input type="text" data-value="{{ec.ec_id}}" value="{{ec.ecl_subject}}" placeholder="{{ec.ecl_en_subject}}" name="ecl_subject" class="form-control/>

emberjs中的数据值属性

2 个答案: