我有一个输入密码字段。我希望能够警告用户他们在密码中不能有任何空格。我发现的问题是我无法将尾随空格传递给范围以检测它并警告用户他们不能这样做。
请参阅我的 plunkr 示例:LINK
如果您在输入字段中键入,则范围将返回密码的字符数,如果您在密码末尾添加空格,则范围将不会报告正确的字符串长度,因为它显然会修剪任何尾随空格,这意味着我无法识别用户是否输入了任何空格。因此,当用户添加尾随空格时,输入密码字段将显示已添加额外字符,而范围仅报告字符长度而没有任何尾随空格。
我有一个输入密码字段。我希望能够警告用户他们在密码中不能有任何空格。我发现的问题是我无法将尾随空格传递给范围以检测它并警告用户他们不能这样做。
请参阅我的 plunkr 示例:LINK
如果您在输入字段中键入,则范围将返回密码的字符数,如果您在密码末尾添加空格,则范围将不会报告正确的字符串长度,因为它显然会修剪任何尾随空格,这意味着我无法识别用户是否输入了任何空格。因此,当用户添加尾随空格时,输入密码字段将显示已添加额外字符,而范围仅报告字符长度而没有任何尾随空格。
这是固定的 plunkr 解决方案升级到 Angular 的 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';
});