Question

我在表单中有一个box.width ng-model值，打算以英寸为单位存储框的宽度。我希望用户能够在＆＃34; ft＆＃34;中看到宽度。然而，＆＃34;在＆＃34;中。在大多数情况下，我有它的工作。我有2个指令，用于将总英寸数量格式化为英尺数和剩余英寸数。

示例：http://plnkr.co/edit/Zar1vQ7L2NlxyZeBmY4n?p=preview

问题：

当用户修改表单中的英寸数时触发的解析器只能在某种程度上可靠地工作。如果用户反复单击向上箭头，则英寸字段有时会保持在11（作为最大值，根据需要），但有时会允许输入12。从控制台日志来看，它就像解析器一样甚至没有被解雇（可能是因为我在解析器中设置了element.val（））。这是相关的解析器函数：

function inchesOnlyParser(input) {
   var numFeet = Math.floor(ngModelController.$modelValue / 12);
   var inchesEntered = input;

   if (inchesEntered > 11) {
       var small = numFeet * 12 + 11;
       element.val(11);
       return small;
   }

   return numFeet * 12 + inchesEntered;
}

起初我尝试将max=11放在输入字段上以进行英寸分解，但是这会导致角度在总英寸数上设置最大值，因此不是＆＃39;我的解决方案。

我尝试使用https://docs.angularjs.org/api/ng/type/ngModel.NgModelController中提到的各种ngModelController方法但是找不到适用于我的解决方案，包括$ rollbackViewValue，$ render，$ setViewValue等的组合不过，我可能不太了解文档。

正如我所暗示的那样，我想要的用户界面将是用户在英寸输入区域内不能超过11英寸;如果Angular没有参与，它的行为与max=11设置类似。

Answer 1

在inchesOnly指令中，不是使用element.val(11);设置输入元素的值，而是设置视图值并再次渲染。

ngModelController.$setViewValue(11);
ngModelController.$render();

相关问题https://stackoverflow.com/a/19168292/1061668

如何在Angular $ parsers管道中修改ng-model

1 个答案: