©
This document uses PHP Chinese website manual Release
URL文本输入校验。如果内容不是有效的URL，则设置url验证错误键。
<input Type="url"
ng-model=""
[name=""]
[required=""]
[ng-required=""]
[ng-minlength=""]
[ng-maxlength=""]
[ng-pattern=""]
[ng-change=""]>| 参数 | 类型 | 详述 |
|---|---|---|
| ngModel | string | 声明用于数据绑定的Angular表达式。 |
| name (可选)
|
string | 发布到表单下的控件的属性名称。 |
| required
(可选)
|
string | 如果未输入值就设置 |
| ngRequired
(可选)
|
string | 当ngRequired表达式等于true时，添加 |
| ngMinlength
(可选)
|
number | 如果值短于minlength则设置 |
| ngMaxlength
(可选)
|
number | 如果值长于maxlength则设置 |
| ngPattern
(可选)
|
string | 如果值不匹配正则表达式则设置 |
| ngChange
(可选)
|
string | Angular表达式，当输入元素通过用户交互方式发生输入变化时会执行这个表达式。 |
<script>
angular.module('urlExample', [])
.controller('ExampleController', ['$scope', Function($scope) {
$scope.text = 'http://google.com';
}]);
</script>
<form name="myForm" ng-controller="ExampleController">
URL: <input Type="url" name="input" ng-model="text" required>
<span class="error" ng-show="myForm.input.$error.required">
Required!</span>
<span class="error" ng-show="myForm.input.$error.url">
Not valid url!</span>
<tt>text = {{text}}</tt><br/>
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
<tt>myForm.$error.url = {{!!myForm.$error.url}}</tt><br/>
</form>var text = element(by.binding('text'));
var valid = element(by.binding('myForm.input.$valid'));
var input = element(by.model('text'));
it('should initialize to model', Function() {
expect(text.getText()).toContain('http://google.com');
expect(valid.getText()).toContain('true');});
it('should be invalid if empty', Function() {
input.clear();
input.sendKeys('');
expect(text.getText()).toEqual('text =');
expect(valid.getText()).toContain('false');});
it('should be invalid if not url', Function() {
input.clear();
input.sendKeys('box');
expect(valid.getText()).toContain('false');});