अपडेट करें:
एक ही कार्यक्षमता के साथ पिछले निर्देश (दो के बजाय एक) का बेहतर और सरल संस्करण:
.directive('myTestExpression', ['$parse', function ($parse) {
return {
restrict: 'A',
require: 'ngModel',
link: function (scope, element, attrs, ctrl) {
var expr = attrs.myTestExpression;
var watches = attrs.myTestExpressionWatch;
ctrl.$validators.mytestexpression = function (modelValue, viewValue) {
return expr == undefined || (angular.isString(expr) && expr.length < 1) || $parse(expr)(scope, { $model: modelValue, $view: viewValue }) === true;
};
if (angular.isString(watches)) {
angular.forEach(watches.split(",").filter(function (n) { return !!n; }), function (n) {
scope.$watch(n, function () {
ctrl.$validate();
});
});
}
}
};
}])
उदाहरण का उपयोग:
<input ng-model="price1"
my-test-expression="$model > 0"
my-test-expression-watch="price2,someOtherWatchedPrice" />
<input ng-model="price2"
my-test-expression="$model > 10"
my-test-expression-watch="price1"
required />
परिणाम: पारस्परिक रूप से आश्रित परीक्षण अभिव्यक्ति जहां सत्यापनकर्ताओं को दूसरे के निर्देश मॉडल और वर्तमान मॉडल के परिवर्तन पर निष्पादित किया जाता है।
परीक्षण अभिव्यक्ति में स्थानीय $modelचर है जिसे आपको अन्य चर की तुलना करने के लिए उपयोग करना चाहिए।
पहले:
मैंने अतिरिक्त निर्देश जोड़कर @Plantface कोड को बेहतर बनाने का प्रयास किया है। यदि हमारी अभिव्यक्ति को एक से अधिक ngModel वैरिएबल में परिवर्तन किया जाता है, तो यह अतिरिक्त निर्देश बहुत उपयोगी है।
.directive('ensureExpression', ['$parse', function($parse) {
return {
restrict: 'A',
require: 'ngModel',
controller: function () { },
scope: true,
link: function (scope, element, attrs, ngModelCtrl) {
scope.validate = function () {
var booleanResult = $parse(attrs.ensureExpression)(scope);
ngModelCtrl.$setValidity('expression', booleanResult);
};
scope.$watch(attrs.ngModel, function(value) {
scope.validate();
});
}
};
}])
.directive('ensureWatch', ['$parse', function ($parse) {
return {
restrict: 'A',
require: 'ensureExpression',
link: function (scope, element, attrs, ctrl) {
angular.forEach(attrs.ensureWatch.split(",").filter(function (n) { return !!n; }), function (n) {
scope.$watch(n, function () {
scope.validate();
});
});
}
};
}])
क्रॉस वैरिफाइड फ़ील्ड बनाने के लिए इसका उपयोग करने का उदाहरण:
<input name="price1"
ng-model="price1"
ensure-expression="price1 > price2"
ensure-watch="price2" />
<input name="price2"
ng-model="price2"
ensure-expression="price2 > price3"
ensure-watch="price3" />
<input name="price3"
ng-model="price3"
ensure-expression="price3 > price1 && price3 > price2"
ensure-watch="price1,price2" />
ensure-expressionजब ng-modelकोई भी ensure-watchचर बदला जाता है तो मॉडल को मान्य करने के लिए निष्पादित किया जाता है।