Question

我想阻止用户从 AngualrJS 中的文本框中删除一定长度的字符串。

我希望在文本框中修复一些像“abcd”这样的文本，以便用户无法删除它。它会像 pre-string 。

为此我用 ng-init 初始化了文本框，在 keyup 事件上我正在检查字符串的长度，如果它小于预定义的大小那么我将字符串放回 ng-model 。

它的工作没有错误，但不顺利。如果文本在文本框中删除文本时达到指定的长度，我希望阻止按退格或删除按钮。

我是 AngularJS 的新手，请有任何人对我有所帮助吗？

以下是Plunker链接。

HTML

<body ng-app="myApp1">
  <div ng-controller="myController">
    <div ng-app>
      <label>Key:</label>
      <input type="text" name="key" ng-model="key" ng-init="key = 'abcd'" ng-keyup="updateKey($event)">
    </div>
  </div>
</body>

AngualrJS

(function(angular) {
  'use strict';
  var myApp = angular.module('myApp1', []);

  myApp.controller('myController', ['$scope', function($scope) {
    $scope.updateKey = function($event) {
      var len = $scope.key.length;
      if ($event.keyCode === 8 && len < 4) {
        $scope.key = "abcd";
      }
    };
  }]);
})(window.angular);

Answer 1

我认为您可以为$watcher

设置明确的$scope.key函数

$scope.$watch('key', function(newValue, oldValue) {
  console.log(oldValue, newValue);
  if(newValue.length < 4) {
    $scope.key = 'abcd';
  }
});

每当模型发生变化时，观察者函数都会调用，所以当你更改模型时，angular会调用这个函数，在函数中我们可以得到old值和new值。你可以做你想做的事。

这是DEMO

在AngualrJS中达到一定长度后，防止从文本框中删除字符串

1 个答案: