角度JS,单击字段不使用按钮时清除文本



我是AngularJS的新手,想知道从我的金额字段中清除文本的正确方法是什么?

我在字段中设置了默认的 0.00,

但我想要当用户在字段中单击时 0.00 消失的功能。

理想情况下,我希望此功能仅适用于默认值,但无论哪种方式,如果它删除了添加的新值,我都不会感到困扰。

我已经尝试过谷歌搜索,我能找到的唯一结果是将清晰的按钮设置为我不想要的字段。

现在我的HTML是:

<number-only-input input-value="transferitems.cashvalue" input-name="cashvalueinput" />

我的控制器范围是:

$scope.totaltransfervalue = 0.00;

我还需要将此功能应用于页面上的其他 4 个金额字段。

我对仅数字输入的指令是:

    app.directive('numberOnlyInput', function ($filter) {
    return {
        restrict: 'EA',           
        template: '<input name="{{inputName}}" ng-model="inputValue" ng-blur="oninputblur()" style="width:100% !important" class="form-control" required />',
        scope: {
            inputValue: '=',
            inputName: '='
        },
        link: function (scope, element, attrs, ngModelController) {               
            scope.oninputblur= function() {
                scope.inputValue = $filter('currency')(scope.inputValue, '', 2);                     
            }                
            scope.$watch('inputValue', function (newValue, oldValue) {
                if (newValue == oldValue) { return; }
                if (!newValue) {
                    scope.inputValue = "";
                } else {
                    var arr = String(newValue).split("");
                    if (arr.length === 0) return;
                    if (arr.length === 1 && (arr[0] == '-' || arr[0] === '.')) return;
                    if (arr.length === 2 && newValue === '-.') return;
                    if (isNaN(newValue)) {
                        scope.inputValue = oldValue;
                    }
                }
            });
        }
    };
});

听起来像是 HTML placeholder属性的工作

<input placeholder="{{totalTransferValue}}" input-value="transferitems.cashvalue" input-name="cashvalueinput" />

它将范围变量的当前值显示为灰显的内容,当用户开始在框中键入时,该内容将消失。这不限于默认值。不再相关,因为这个问题已经发生了根本性的变化。

您应该能够通过调整指令本身来实现您想要的。

首先,您需要向模板添加ng-focus

template: '<input ng-focus="oninputfocus()" ...

然后实现处理程序

link: function (scope, element, attrs, ngModelController) {               
    scope.oninputfocus = function(){
        // if(scope.inputValue == myDefaultValue) {
        scope.inputValue = '';
        // }
    },
    scope.oninputblur= ...

你应该已经准备好了。我包括(作为评论(如何检查仅清除字段中的默认值。

最新更新