如何仅使用 ember js 将 type="number" 设为正数答案

【问题标题】：How to make type=“number” to positive numbers only using ember js如何仅使用 ember js 将 type="number" 设为正数
【发布时间】：2018-09-01 08:16:01
【问题描述】：

它只是防止从向上/向下箭头输入负数，而用户可以从键盘输入负数。

 <div class="col-sm-2">
        <label>Quantity</label><br>
           {{input type="number" value=quantity min="0" class="form-control- 
           invoice"}}
</div>

【问题讨论】：

emberjs 的一个强大之处在于它是一个很棒的插件社区。有几个validation addons 用于客户端验证。

标签： javascript django ember.js

【解决方案1】：

这是数据向下，动作向上 (DDAU) 原则的一个很好的例子。数据应该向下流向您的组件（或元素），但只有在符合某些条件时才由您的应用程序更新。遗憾的是{{input}} helper 不支持 DDAU 原则。但是您可以在不使用它的情况下轻松实现目标：

<input type="number" value={{quantity}} onchange={{action "updateQuantity" value="target.value"}} min="0" >

我们使用标准的<input> 元素并将其value 属性绑定到quantity。我们将自定义操作绑定到change 事件。在该操作中，我们可以检查更新后的值是否符合我们的标准，如果符合，则更新quantity。该操作可能如下所示：

actions: {
  updateQuantity(val) {
    val = parseInt(val);
    if (val >= 0) {
      this.set('quantity', val);
    } else {
      window.alert('number must not be negative');
      this.notifyPropertyChange('quantity');
    }
  }
}

请注意，如果新值不符合我们的标准，我们必须致电notifyPropertyChange()。这将触发 UI 更新以重置 <input> 元素的值。

我写了一个 Ember Twiddle 来演示这个方法：https://ember-twiddle.com/bcf03934667364252e52b21930d664fd?openFiles=templates.application.hbs%2C

【讨论】：