Какие изменения кода необходимо сделать, чтобы получить директиву countparens
ниже, чтобы предоставить дополнительную пользовательскую проверку строки, показанную ниже во время проверки формы? Код ниже ПРЕДУПРЕЖДЕНА предупреждает пользователя, когда поле ввода пуст, но оно НЕ предупреждает пользователя, когда количество открытых парсеров (
и закрытых парен )
не равно.
Я использую AngularJS. Я использовал документацию по этой ссылке (прокрутите вниз), чтобы создать код ниже.
Вот html для формы:
<table>
<tr>
<td width=200>
<form name="userForm" ng-submit="rectangularForm(userForm.$valid)" novalidate>
<input type="text" name="fieldname" ng-model="nameofjsontype.fieldname" required />
<p ng-show="userForm.fieldname.$invalid && !userForm.fieldname.$pristine" class="help-block">Function is a required field.</p>
<span ng-show="userForm.nameofjsontype.fieldname.$error.countparens">The #( != #) !</span>
<br>
<button type="submit" ng-disabled="userForm.$invalid" >Click to submit</button>
</form>
</td>
</tr>
</table>
Файл javascript, содержащий директиву, включает:
// create angular app
var myApp = angular.module('myApp', []);
// create angular controller
myApp.controller('myController', ['$scope', '$http', function($scope, $http) {
$scope.nameofjsontype = {type:"nameofjsontype", fieldname: 'some (value) here.'};
$scope.rectangularForm = function(isValid) {
// check to make sure the form is completely valid
if (isValid) {
var funcJSON = {type:"nameofjsontype", fieldname: $scope.nameofjsontype.fieldname};
$http.post('/server/side/controller', funcJSON).then(function(response) {
$scope.nameofjsontype = response.data;
});
}
};
}]);
myApp.directive('countparens', function() {
return {
require: 'ngModel',
link: function(scope, elm, attrs, ctrl) {
ctrl.$validators.countparens = function(modelValue, viewValue) {
if (ctrl.$isEmpty(modelValue)) {
// consider empty models to be valid
return true;
}
if (
($scope.nameofjsontype.fieldname.match(/\)/g).length) == ($scope.nameofjsontype.fieldname.match(/\(/g).length)
) {
// it is valid
return true;
}
// it is invalid
return false;
};
}
};
});
Ваша разметка должна использоваться userForm.fieldname.$error.countparens
чтобы показать ошибку. Поле, связанное с userForm
, не совпадает с вашим значением ngModel
. См. Plunker, что я имею в виду
<span ng-show="userForm.fieldname.$error.countparens" class="help-block">The #( != #) !</span>
Вы также не используете свою директиву для своего элемента ввода:
<input type="text" name="fieldname" ng-model="nameofjsontype.fieldname" required data-countparens=""/>
В вашей директиве
modelValue
а не значение области при выполнении вашего соответствия AND(
или )
,
myApp.directive('countparens', function() {
return {
require: 'ngModel',
link: function(scope, elm, attrs, ctrl) {
ctrl.$validators.countparens = function(modelValue, viewValue) {
return ctrl.$isEmpty(modelValue) ||
((modelValue.match(/\)/g) || []).length == (modelValue.match(/\(/g) || []).length);
};
}
};
});