एंगुलरजेएस निर्देश

Question

से कई इनपुट की वैधता सेट करें मैं एक निर्देश बनाने की कोशिश कर रहा हूं जिसका उपयोग किसी समूह में एकाधिक इनपुट नियंत्रणों की सत्यापन स्थिति को रीसेट करने के लिए किया जा सकता है, जब नियंत्रण में से कोई एक मूल्य बदल जाता है। समूहों को HTML में सेट निर्देश के गुण द्वारा पहचाना जाता है। पूर्व: - दिनांक से और दोनों आदानों तिथि करने के लिए वैधता राज्य जब नियंत्रण इनपुट मूल्य में से एक उपयोगकर्ता द्वारा बदला है रीसेट करता है

यह वही है मैं अब तक

जे एस है/कोणीय

angular.module('myModule').directive('groupedInputs', function() { 
    return { 
     restrict: 'A', 
     require: '?ngModel', 
     link: function (scope, element, attrs, ctrl) { 
      element.on('change', function() { 

       // Resetting own validity 
       scope.$apply(ctrl.$setValidity('server', true)); 

       // Here I need to set the validity of the controls which 
       // have the `GroupedInputs` directive with the 
       // same attribute value 
      }); 
     } 
    }; 
}); 

एचटीएमएल

<input name="FromDate" type="date" class="form-control" ng-model="model.FromDate" grouped-inputs="FromToDates"> 
<input name="ToDate" type="date" class="form-control" ng-model="model.ToDate" grouped-inputs="FromToDates"> 

यह अपने इनपुट नियंत्रण की वैधता को रीसेट कर सकता है, लेकिन निर्देश और समान विशेषता मान के साथ अन्य इनपुट नियंत्रणों तक नहीं पहुंच सकता है। एक ही विशेषता के साथ इनपुट पूछकर अन्य नियंत्रणों तक पहुंचने का सबसे अच्छा संभव कोणीय तरीका क्या है?

Answer 1

मैं समूह तत्वों नियंत्रकों को समूह में जोड़ने और समूह में सभी तत्वों की वैधता सेट करने के तरीकों के साथ सहायक तत्वों को स्टोर करने के लिए सहायक ऑब्जेक्ट को कार्यान्वित करके इस समस्या से संपर्क करने का प्रयास करूंगा।

कुछ इस तरह:

angular.module('myModule').directive('groupedInputs', function() { 

    var groupControls = { 
     groups: {}, 
     add: function(name, ctrl) { 
      this.groups[name] = this.groups[name] || []; 
      this.groups[name].push(ctrl); 
     }, 
     setValidity: function(name, key, value) { 
      this.groups[name].forEach(function(ctrl) { 
       ctrl.$setValidity(key, value); 
      }); 
     } 
    }; 

    return { 
     restrict: 'A', 
     require: '?ngModel', 
     link: function(scope, element, attrs, ctrl) { 

      // Add element controller to the group 
      groupControls.add(attrs.groupedInputs, ctrl); 

      element.on('change', function() { 

       // When needed, set validity of elements in the group 
       groupControls.setValidity(attrs.groupedInputs, 'server', false); 
       scope.$apply(); 

      }); 
     } 
    }; 
}); 

डेमो:http://plnkr.co/edit/fusaaN6k9J5SZ7iQA97V?p=preview

Answer 2

आप सभी एक सरणी में एक ही समूह होने नियंत्रकों संग्रहीत कर सकती है:

angular.module('myModule').directive('groupedInputs', function() { 
    var controllersPerGroup = {}; 

    return { 
     restrict: 'A', 
     require: '?ngModel', 
     link: function (scope, element, attrs, ctrl) { 
      var groupName = attrs.groupedInputs; 
      var group = controllersPerGroup[groupName]; 
      if (!group) { 
       group = []; 
       controllersPerGroup[groupName] = group; 
      } 
      group.push(ctrl); 

      element.on('change', function() { 

       // Resetting own validity 
       scope.$apply(ctrl.$setValidity('server', true)); 

       // all the other controllers of the same group are in the groups array. 
      }); 
     } 
    }; 
}); 

मत भूलना एक बार तत्व $destroy घटना सुनकर, नष्ट हो जाता है नियंत्रकों को दूर करने का ख्याल रखना।