Javascript Jquery touchstart不适用于模式字段

在我的angularJs项目中，touchstart事件在模式字段上不起作用（下面代码中的rate1），但页面中的非模式字段工作正常。任何帮助都将不胜感激

请在下面找到我的代码：

<div class="percentage-field">
    <span ng-show="!capEntering1 && addQuteFormPopup.interestRate1.$touched" class="double-digit" ng-if="!fhaCtrl.isDisabled">%</span>
    <input type="text" id="rate1" name="interestRate1" placeholder="XX.XXX %"  ng-class="{'error': addQuteFormPopup.interestRate1.$touched && fhaCtrl.interestRate1 ==='0.0'}" ng-disabled="fhaCtrl.isDisabled" gw-allow-only="numbers dots" number-format="5,3" maxlength="6" ng-model="fhaCtrl.interestRate1"
    class="form-control" ng-blur="capEntering1 = false;" ng-focus="capEntering1 = true"><span class="double-digit" ng-if="fhaCtrl.isDisabled" ng-init="capEntering1 = true">%</span>
</div>

---

很抱歉忘了提及事件（touchstart）的目的是将type属性更新为number，从而在移动设备中显示number pad。editLoanAmount和editDti非模式字段，而rate1属于modalNever-Don’s…它通过在模式打开后添加touchstart事件触发器得到解决。

 angular.element(document).ready((): void => {
    $('#editLoanAmount').on('touchstart', (): void => {
        $('#editLoanAmount').attr('type', 'number');
    });
        $('#editDti').on('touchstart', (): void => {
        $('#editDti').attr('type', 'number');
    });
    $('#rate1').on('touchstart', (): void => {
        $('#rate1').attr('type', 'number');
    });
});