我试图使用角度为2的ngControl值来验证输入字段.我需要验证用户始终以大写形式输入值.
现在我们需要将用户输入的值转换为大写.但是我使用ngControl处理输入字段中的值,而不是ngModel(考虑到我可以使用ngModelChange事件将值更新为大写.)
那么转换ngControl使用的值的最佳和低成本方法是什么?
我坚持如何ngModel使用指令访问和更改输入值.问题的结果是,当我选择所需的地址时,模型的地址值不会更新...它只是设置为我实际键入输入的内容,而不是输入的最终值.
我键入'830':
我选择'8300 Fauntleroy Way Southwest,Seattle,WA,United States':
结果价值:
{
address: '830'
}
Run Code Online (Sandbox Code Playgroud)
期望值:
{
address: '8300 Fauntleroy Way Southwest, Seattle, WA, United States'
}
Run Code Online (Sandbox Code Playgroud)
在AngularJS中,我可以这样做:
(function() {
'use strict';
angular
.module('casemanagerApp')
.directive('googleplace', googleplace);
function googleplace() {
var directive = {
require: 'ngModel',
link: link
};
return directive;
function link(scope, element, attrs, model) {
var options = {
types: [],
componentRestrictions: {}
};
scope.gPlace = new google.maps.places.Autocomplete(element[0], options); // jshint ignore:line
google.maps.event.addListener(scope.gPlace, 'place_changed', function() { // jshint ignore:line
scope.$apply(function() …Run Code Online (Sandbox Code Playgroud) 我已经按照https://auth0.com/blog/angular-2-series-part-5-forms-and-custom-validation/实现了表单验证
<input class="form-control"
type="text"
name="phone"
autocomplete="off"
placeholder="(XXX)-XXX-XXXX"
mask=""
[disabled]="disabled"
[(ngModel)]="candidate.phone"
ngControl="phone"/>
Run Code Online (Sandbox Code Playgroud)
...
...
static phone(control: Control): ValidationResult {
let URL_REGEXP = /^\(\d{3}\)-\d{3}-\d{4}$/i;
if (control.value && (control.value.length <= 5 || !URL_REGEXP.test(control.value))) {
return {"phone": true};
}
return null;
}
Run Code Online (Sandbox Code Playgroud)
加上这个元素我已经实现了输入掩码目录:http://pastebin.com/wRzHSsVy
出现以下问题:输入电话号码时,验证首先执行,然后输入掩码目录.因此验证器检查的数据和输入掩码目录格式化的数据不同.例如,验证器上的电话号码是(888)-888-88882,掩码将数字转换为以下格式(888)-888-8888,但验证器已经工作并在掩码激活之前指出了错误.