Question

我对角js很新，所以请原谅我，如果这是微不足道的话。但我希望能够在用户输入有效的URL之前显示特定文本区域的错误消息。我不知道我错过了什么，但我非常接近。在用户实际输入正确的输入后，我似乎无法使错误消息消失。

例如，sample.com有效，错误应该消失。 'sample.c'无效且消息应该存在。这是我目前关注的主要领域，但我也想知道如何最初隐藏消息，也就是说它们在实际开始输入之前不应该显示。这就是我到目前为止所做的：

    <div class="col-xs-12" ng-style="clip.clipStyle">
      <div class="form-group">
        <form action="/update"  method="POST">
          <input type="text" name = "userURL" class="form-control preview-input" ng-model="clip.link" id="link_{{clip.ordering}}" ng-blur="loadTitle(clip, $event); showUpload(clip);" e-maxlength="2000" placeholder='<spring:message code="journalist.clip.link.placeholder"/>'
          <span style="color:red" ng-show = "!validUrl()">
           Sorry Not a Valid URL.</span>
        </form>
     </div>
   </div>

这是我的剧本：

$scope.validUrl = function () {
   return CommonUtils.isValidUrl($scope.url);
};

isValidUrl（String）功能正常，因为它适用于其他地方。我很感激任何意见。谢谢！

1）当ng-show = validUrl（）时 image

2）当ng-show =！validUrl（）时 image

在这些片段中，在1.）中没有任何内容可以启用文本框，并且在2.）没有任何内容会使文本颜色从红色变化，也不会使文本框下面的消息消失。

Answer 1

我创建了一个jsfiddle来展示这应该如何运作。我没有您的CommonUtils，或者控制器或页面的其余部分，因此我创建了一个非常基本示例。它似乎在小提琴中按预期工作，所以希望这会在你的实现中显示缺失或错误。

＆＃13;

var app = angular.module("sample", [])
.controller("sampleController", function ($scope) {
	var regex = /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/;
 	$scope.url = "http://google.com";
  $scope.isValid = function (text) {
  	return regex.test(text);
  };
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
<div ng-app="sample">
  <div ng-controller="sampleController">
    <input type="text" ng-model="url" />
    <span style="color: red;" ng-hide="isValid(url)">The url is invalid</span>
  </div>
</div>

＆＃13;

如何在输入（文本）格式正确的URL之前显示错误消息？在Angular js

1 个答案: