从输入类型密码到范围获取尾随空格?

时间:2013-07-12 18:17:37

标签: javascript angularjs angularjs-scope

我有一个输入密码字段。我希望能够警告用户他们的密码中没有任何空白区域。我发现的麻烦是我无法将尾随空格传递到范围以便检测它并警告用户他们不能这样做。

请参阅我的plunkr示例:LINK

如果输入输入字段,范围将返回密码的字符数,如果在密码末尾添加空格,则范围将不会报告正确的字符串长度,因为它显然会修剪任何尾随空格这意味着我无法确定用户是否输入任何空格。因此,当用户添加尾随空格时,输入密码字段将显示当范围仅报告没有任何尾随空格的字符长度时添加了额外字符。

1 个答案:

答案 0 :(得分:8)

这里的固定式plunkr解决方案是升级到1.1.1角度,以利用ng-trim指令,允许您关闭修剪: http://plnkr.co/edit/FLCQY2zuRV1ZMy6WCbs8?p=preview

升级到Angular 1.1.1或更高版本(经过测试,可能在某些较低版本中有效)将此指令添加到您拥有不想修剪的ng-model的元素中。

ng-trim="false"

以下是完整的详细信息:

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.1.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.1/angular.min.js" data-semver="1.1.1"></script>
    <script src="angular_ui.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <form>
      Pass length is {{pass.length}}<br>
      <input type="password" data-ng-model="pass" data-ng-trim="false">
    </form>
  </body>

</html>

和JS

var app = angular.module('plunker', ['ui.event']);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});