एनजी-रिपीट, एनजी-शो (कोणीय) का उपयोग करके गतिशील रूप से बनाए गए इनपुट को कैसे मान्य करें


167

मेरे पास एक तालिका है जो एनजी-रिपीट का उपयोग करके बनाई गई है। मैं तालिका में प्रत्येक तत्व के लिए सत्यापन जोड़ना चाहता हूं। समस्या यह है कि प्रत्येक इनपुट सेल का नाम उसी सेल के ऊपर और उसके नीचे है। मैंने {{$index}}इनपुट्स को नाम देने के लिए मूल्य का उपयोग करने का प्रयास किया , लेकिन एचटीएमएल में स्ट्रिंग शाब्दिकों के सही होने के बावजूद, यह अब काम कर रहा है।

यहाँ अब के रूप में मेरा कोड है:

<tr ng-repeat="r in model.BSM ">
   <td>
      <input ng-model="r.QTY" class="span1" name="QTY{{$index}}" ng-pattern="/^[\d]*\.?[\d]*$/" required/>
      <span class="alert-error" ng-show="form.QTY{{$index}}.$error.pattern"><strong>Requires a number.</strong></span>
      <span class="alert-error" ng-show="form.QTY{{$index}}.$error.required"><strong>*Required</strong></span>
   </td>
</tr>

मैंने {{}}सूचकांक से हटाने की कोशिश की है , लेकिन यह भी काम नहीं करता है। अब तक, इनपुट की मान्यता संपत्ति सही तरीके से काम कर रही है, लेकिन त्रुटि संदेश प्रदर्शित नहीं होता है।

किसी के पास कोई सुझाव है?

संपादित करें: नीचे दिए गए महान उत्तरों के अलावा, यहां एक ब्लॉग लेख है जो इस मुद्दे को और अधिक विस्तार से कवर करता है: http://www.thebhwgroup.com/blog/2014/08/angularjs-html-form-design-part-2 /


4
2015 में इसे पढ़ने वालों के लिए ... शीर्ष मतदान का जवाब सही नहीं है। नीचे देखो। :)
को स्ट्रॉहल होगा

ऐसा लगता है कि "2015 के लिए" उत्तर @WillStrohl के बारे में बात करता है।
ओसिरिस

यहाँ उचित SO शिष्टाचार क्या है? क्या मुझे स्वीकृत उत्तर को छोड़ देना चाहिए क्योंकि यह उस समय सही था या आज के लिए सही उत्तर को स्वीकार करता है? बस नए आगंतुकों के लिए उपयोगी यह लोकप्रिय रूप से लोकप्रिय धागा चाहते हैं।
PFranchise

@Pranchise, मुझे नहीं पता, लेकिन मुझे लगता है कि इसके बारे में एक दृश्यमान नोट मदद कर सकता है। हो सकता है कि आपके प्रश्न के संपादन के रूप में, इसलिए यह नोट रहता है कि अधिक लोग इसे कहां देख सकते हैं।
ओसिरिस

जवाबों:


197

एंगुलरजेएस सत्यापन त्रुटियों को उजागर करने के लिए इनपुट नामों पर निर्भर करता है।

दुर्भाग्य से, आज के रूप में, यह एक इनपुट के नाम को गतिशील रूप से उत्पन्न करने के लिए (एक कस्टम निर्देश का उपयोग किए बिना) संभव नहीं है। वास्तव में, इनपुट डॉक्स की जाँच करके हम देख सकते हैं कि नाम विशेषता केवल एक स्ट्रिंग को स्वीकार करता है।

'डायनेमिक नाम' समस्या को हल करने के लिए आपको एक आंतरिक रूप बनाने की जरूरत है ( एनजी-फॉर्म देखें ) :

<div ng-repeat="social in formData.socials">
      <ng-form name="urlForm">
            <input type="url" name="socialUrl" ng-model="social.url">
            <span class="alert error" ng-show="urlForm.socialUrl.$error.url">URL error</span>
      </ng-form>
  </div>

दूसरा विकल्प इसके लिए एक कस्टम निर्देश लिखना होगा।

यहाँ jFFiddle ngForm का उपयोग दिखा रहा है: http://jsfiddle.net/pkozlowski_opensource/XK2ZT/2/


2
एक दम बढ़िया। लेकिन क्या यह एक ही नाम के साथ कई टेक्स्ट बॉक्स रखने के लिए वैध HTML है?
इयान वारबर्टन

1
घोंसले के शिकार के रूप में मान्य HTML stackoverflow.com/questions/379610/can-you-nest-html-forms कोणीय योजना इसके लिए एक तय है?
ब्लोसी

11
@Blowsie आप यहां वास्तविक रूप से घोंसला नहीं बना रहे हैं, बल्कि ng-formDOM तत्व हैं, इसलिए अन्य SO प्रश्न का लिंक यहां प्रासंगिक नहीं है।
pkozlowski.opensource

7
महान। यह ध्यान दिया जाना चाहिए कि यदि आपका ng-repeatबाध्य है, table trतो आपको ng-form="myname"एटर का उपयोग करना होगा ।
ivkremer

11
इस उत्तर को संपादित किया जाना चाहिए: मुद्दा github.com/angular/angular.js/issues/1404 को AngularJS 1.3.0 (सितंबर 2014 से कमिट) के बाद से हल किया गया है
tanguy_k

228

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

साथ कोणीय संस्करण 1.3 और बाद में आप अब ऐसा कर सकते हैं:

<form name="vm.myForm" novalidate>
  <div ng-repeat="p in vm.persons">
    <input type="text" name="person_{{$index}}" ng-model="p" required>
    <span ng-show="vm.myForm['person_' + $index].$invalid">Enter a name</span>
  </div>
</form>

डेमो

कोणीय 1.3 ने एनजीमैसेज भी पेश किया, जो फॉर्म सत्यापन के लिए एक अधिक शक्तिशाली उपकरण है। आप ngMessages के साथ एक ही तकनीक का उपयोग कर सकते हैं:

<form name="vm.myFormNgMsg" novalidate>
    <div ng-repeat="p in vm.persons">
      <input type="text" name="person_{{$index}}" ng-model="p" required>
      <span ng-messages="vm.myFormNgMsg['person_' + $index].$error">
        <span ng-message="required">Enter a name</span>
      </span>
    </div>
  </form>

2
यह एक निर्देशन करने की तुलना में एकदम सही है और बहुत आसान है - घटकों में एक फार्म पारित कर सकते हैं और इस पद्धति का उपयोग कर सकते हैं। धन्यवाद दोस्त!
दिनदानी

मैंने देखा कि यदि आप यह काम करना चाहते हैं तो आपके फॉर्म का नाम हाइफ़न नहीं हो सकता है। किसी को पता है क्यों है यह?
पैट्रिक सज्जापस्की

@PatrickSzalapski: यह इसलिए है क्योंकि प्रपत्र नाम को एंगुलर द्वारा उपयोग किया जाता है और हाइफ़न के साथ चर नामों को जावास्क्रिप्ट में मान्य सिंटैक्स नहीं है। समाधान: <span ng-show = "vm ['my-form'] ['person_’ + $ index]। $ अमान्य "> एक नाम दर्ज करें </ span>
HoffZ

मैंने देखा है कि अगर आप एक दोहराया आइटम गतिशील निकालने के लिए, $validनिवेश के लिए संपत्ति को गलत तरीके से हो जाता हैfalse
jonathanwiesel

आप क्या चाहते हैं कि आपकी सभी त्रुटियां फॉर्म के शीर्ष पर एक स्थान पर प्रदर्शित हों?
कोडिंगबक

13

यदि आप एनजी-फॉर्म का उपयोग नहीं करना चाहते हैं तो आप एक कस्टम निर्देश का उपयोग कर सकते हैं जो फॉर्म के नाम की विशेषता को बदल देगा। इस निर्देश को अपने एनजी-मॉडल के समान तत्व पर एक विशेषता के रूप में रखें।

यदि आप संयोजन में अन्य निर्देशों का उपयोग कर रहे हैं, तो सावधान रहें कि उनके पास "टर्मिनल" संपत्ति सेट नहीं है अन्यथा यह फ़ंक्शन नहीं चल पाएगा (यह देखते हुए कि यह -1 की प्राथमिकता है)।

उदाहरण के लिए, जब इस निर्देश का उपयोग एनजी विकल्पों के साथ किया जाता है, तो आपको इस एक लाइन को अवश्य चलाना होगा: https://github.com/AlJohri/bower-angular/commit/eb17a967b7973eb7fc1b4b04b8b3ca540a155

angular.module('app').directive('fieldNameHack', function() {
    return {
      restrict: 'A',
      priority: -1,
      require: ['ngModel'],
      // the ngModelDirective has a priority of 0.
      // priority is run in reverse order for postLink functions.
      link: function (scope, iElement, iAttrs, ctrls) {

        var name = iElement[0].name;
        name = name.replace(/\{\{\$index\}\}/g, scope.$index);

        var modelCtrl = ctrls[0];
        modelCtrl.$name = name;

      }
    };
});

मुझे अक्सर $ index को एक चर नाम पर सेट करने के लिए ng-init का उपयोग करना उपयोगी लगता है। उदाहरण के लिए:

<fieldset class='inputs' ng-repeat="question questions" ng-init="qIndex = $index">

इससे आपकी नियमित अभिव्यक्ति बदल जाती है:

name = name.replace(/\{\{qIndex\}\}/g, scope.qIndex);

यदि आपके पास कई नेस्टेड एनपी-रिपीट हैं, तो आप अब $ पैरेंट के बजाय इन वेरिएबल नामों का उपयोग कर सकते हैं। $ इंडेक्स।

निर्देशों के लिए "टर्मिनल" और "प्राथमिकता" की परिभाषा : https://docs.angularjs.org/api/ng/service/ $ संकलन # निर्देश-परिभाषा-वस्तु

एनजी-ऑप्शन मंकीपैक की आवश्यकता के बारे में Github टिप्पणी: https://github.com/angular/angular.js/commit/9ee2cdff44e7d496774b340de816344126457bb##mitmitcomment-6832095 https://twitter.com/aljohri/status/4835615203

अपडेट करें:

आप इस काम को एनजी-फॉर्म के साथ भी कर सकते हैं।

angular.module('app').directive('formNameHack', function() {
    return {
      restrict: 'A',
      priority: 0,
      require: ['form'],
      compile: function() {
        return {
          pre: function(scope, iElement, iAttrs, ctrls) {
            var parentForm = $(iElement).parent().controller('form');
            if (parentForm) {
                var formCtrl = ctrls[0];
                delete parentForm[formCtrl.$name];
                formCtrl.$name = formCtrl.$name.replace(/\{\{\$index\}\}/g, scope.$index);
                parentForm[formCtrl.$name] = formCtrl;
            }
          }
        }
      }
    };
});

3
बस इसे स्पष्ट करने के लिए, यह उत्तर चयनित नहीं किया जा रहा है, यह संकेत नहीं है कि यह सबसे अच्छा उत्तर नहीं है। मूल रूप से प्रश्न पूछे जाने के लगभग 2 साल बाद इसे पोस्ट किया गया था। यदि आप इस एक ही मुद्दे में भाग लेते हैं तो मैं इस जवाब और टोमग्रीन दोनों को चुनिंदा उत्तर के अलावा मानूंगा।
PFranchise

11

एनजी-फॉर्म निर्देश का उपयोग उस टैग के अंदर करें जिसमें आप एनजी-रिपीट निर्देश का उपयोग कर रहे हैं। फिर आप जेनेरिक नाम को संदर्भित करने के लिए एनजी-फॉर्म निर्देश द्वारा बनाए गए दायरे का उपयोग कर सकते हैं। उदाहरण के लिए:

    <div class="form-group col-sm-6" data-ng-form="subForm" data-ng-repeat="field in justificationInfo.justifications"">

        <label for="{{field.label}}"><h3>{{field.label}}</h3></label>
        <i class="icon-valid" data-ng-show="subForm.input.$dirty && subForm.input.$valid"></i>
        <i class="icon-invalid" data-ng-show="subForm.input.$dirty && subForm.input.$invalid"></i>
        <textarea placeholder="{{field.placeholder}}" class="form-control" id="{{field.label}}" name="input" type="text" rows="3" data-ng-model="field.value" required>{{field.value}}</textarea>

    </div>

इसका श्रेय: http://www.benlesh.com/2013/03/angular-js-validating-form-elements-in.html


स्वीकृत जवाब मेरे काम नहीं आया। यह एक हालांकि किया था। (मैं कोणीय
2.1.14 का

+1 इस जवाब ने मेरे लिए काम किया लिंक की जाँच करें : आपको बस ng-form="formName"उस टैग में जोड़ना होगा जो एनजी-रिपीट है ... यह एक आकर्षण की तरह काम करता है :)
अब्देल्लाह अलाउई

3

नियंत्रक के पक्ष में "कस्टम सत्यापन" के साथ और अधिक जटिल उदाहरण जोड़ा गया http://jsfiddle.net/82PX4/3/

<div class='line' ng-repeat='line in ranges' ng-form='lineForm'>
    low: <input type='text' 
                name='low'
                ng-pattern='/^\d+$/' 
                ng-change="lowChanged(this, $index)" ng-model='line.low' />
    up: <input type='text' 
                name='up'
                ng-pattern='/^\d+$/'
                ng-change="upChanged(this, $index)" 
                ng-model='line.up' />
    <a href ng-if='!$first' ng-click='removeRange($index)'>Delete</a>
    <div class='error' ng-show='lineForm.$error.pattern'>
        Must be a number.
    </div>
    <div class='error' ng-show='lineForm.$error.range'>
        Low must be less the Up.
    </div>
</div>

1

इन समाधानों को देखते हुए, ऊपर अल जौहरी द्वारा प्रदान किया गया, मेरी जरूरतों के सबसे करीब है, लेकिन उसका निर्देश थोड़ा कम प्रोग्राम योग्य था, तब मैं चाहता था। यहाँ मेरे समाधान का संस्करण है:

angular.module("app", [])
    .directive("dynamicFormName", function() {
        return {
            restrict: "A",
            priority: 0,
            require: ["form"],
            compile: function() {
                return {
                    pre: function preLink(scope, iElement, iAttrs, ctrls) {
                        var name = "field" + scope.$index;

                        if (iAttrs.dnfnNameExpression) {
                            name = scope.$eval(iAttrs.dnfnNameExpression);
                        }

                        var parentForm = iElement.parent().controller("form");
                        if (parentForm) {
                            var formCtrl = ctrls[0];
                            delete parentForm[formCtrl.$name];
                            formCtrl.$name = name;
                            parentForm[formCtrl.$name] = formCtrl;
                        }
                    }
                 }
            }
        };
   });

यह समाधान आपको निर्देशन के लिए केवल एक नाम जनरेटर की अभिव्यक्ति पास करने देता है और लॉक डाउन पैटर्न पैटर्न प्रतिस्थापन से बचता है जो वह उपयोग कर रहा था।

मुझे इस समाधान के साथ शुरुआत में भी परेशानी हुई क्योंकि यह मार्कअप में इसका उपयोग करने का उदाहरण नहीं दिखा, इसलिए यहां बताया गया है कि मैंने इसका उपयोग कैसे किया।

<form name="theForm">
    <div ng-repeat="field in fields">
        <input type="number" ng-form name="theInput{{field.id}}" ng-model="field.value" dynamic-form-name dnfn-name-expression="'theInput' + field.id">        
    </div>
</form>

मेरे पास जीथब पर अधिक संपूर्ण काम करने का उदाहरण है ।


1

सत्यापन एनजी दोहराने के साथ काम कर रहा है अगर मैं निम्नलिखित सिंटैक्स का उपयोग करता scope.step3Form['item[107][quantity]'].$touched हूं तो मुझे नहीं पता कि यह सबसे अच्छा अभ्यास या सबसे अच्छा समाधान है, लेकिन यह काम करता है

<tr ng-repeat="item in items">
   <td>
        <div class="form-group">
            <input type="text" ng-model="item.quantity" name="item[<% item.id%>][quantity]" required="" class="form-control" placeholder = "# of Units" />
            <span ng-show="step3Form.$submitted || step3Form['item[<% item.id %>][quantity]'].$touched">
                <span class="help-block" ng-show="step3Form['item[<% item.id %>][quantity]'].$error.required"> # of Units is required.</span>
            </span>
        </div>
    </td>
</tr>

1

Pkozlowski.opensource के उत्तर पर बिल्डिंग , मैंने डायनामिक इनपुट नाम रखने का एक तरीका जोड़ा है जो ngMessages के साथ भी काम करता है । तत्व और के उपयोग ng-initपर भाग पर ध्यान दें । चर के नाम का के लिए चर मान हो जाता है की विशेषता।ng-formfurryNamefurryNameinputname

<ion-item ng-repeat="animal in creatures track by $index">
<ng-form name="animalsForm" ng-init="furryName = 'furry' + $index">
        <!-- animal is furry toggle buttons -->
        <input id="furryRadio{{$index}}"
               type="radio"
               name="{{furryName}}"
               ng-model="animal.isFurry"
               ng-value="radioBoolValues.boolTrue"
               required
                >
        <label for="furryRadio{{$index}}">Furry</label>

        <input id="hairlessRadio{{$index}}"
               name="{{furryName}}"
               type="radio"
               ng-model="animal.isFurry"
               ng-value="radioBoolValues.boolFalse"
               required
               >
        <label for="hairlessRadio{{$index}}">Hairless</label>

        <div ng-messages="animalsForm[furryName].$error"
             class="form-errors"
             ng-show="animalsForm[furryName].$invalid && sectionForm.$submitted">
            <div ng-messages-include="client/views/partials/form-errors.ng.html"></div>
        </div>
</ng-form>
</ion-item>

1

बहुत देर हो चुकी है लेकिन हो सकता है कि यह किसी की मदद कर सके

  1. हर नियंत्रण के लिए अद्वितीय नाम बनाएँ
  2. का उपयोग करके मान्य fromname[uniquname].$error

नमूना कोड:

<input 
    ng-model="r.QTY" 
    class="span1" 
    name="QTY{{$index}}" 
    ng-pattern="/^[\d]*\.?[\d]*$/" required/>
<div ng-messages="formName['QTY' +$index].$error"
     ng-show="formName['QTY' +$index].$dirty || formName.$submitted">
   <div ng-message="required" class='error'>Required</div>
   <div ng-message="pattern" class='error'>Invalid Pattern</div>
</div>

यहां काम कर रहे डेमो देखें


1

यदि आपका एनजी-रिपीट $ इंडेक्स का उपयोग इस तरह से काम करता है

  name="QTY{{$index}}"

तथा

   <td>
       <input ng-model="r.QTY" class="span1" name="QTY{{$index}}" ng-            
        pattern="/^[\d]*\.?[\d]*$/" required/>
        <span class="alert-error" ng-show="form['QTY' + $index].$error.pattern">
        <strong>Requires a number.</strong></span>
        <span class="alert-error" ng-show="form['QTY' + $index].$error.required">
       <strong>*Required</strong></span>
    </td>

हमें एनजी-शो को एनजी-पैटर्न में दिखाना होगा

   <span class="alert-error" ng-show="form['QTY' + $index].$error.pattern">
   <span class="alert-error" ng-show="form['QTY' + $index].$error.required">

0

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

टेबल को इस तरह से लपेटें

तो बस इस का उपयोग करें

मेरे पास मल्टी-नेस्टेड निर्देशों के साथ एक फॉर्म है जिसमें सभी इनपुट (एस), चयन (एस), आदि हैं ... ये सभी तत्व एनजी-रिपीट और गतिशील स्ट्रिंग मानों में संलग्न हैं।

यह निर्देश का उपयोग करने का तरीका है:

<form name="myFormName">
  <nested directives of many levels>
    <your table here>
    <perhaps a td here>
    ex: <input ng-repeat=(index, variable) in variables" type="text"
               my-name="{{ variable.name + '/' + 'myFormName' }}"
               ng-model="variable.name" required />
    ex: <select ng-model="variable.name" ng-options="label in label in {{ variable.options }}"
                my-name="{{ variable.name + index + '/' + 'myFormName' }}"
        </select>
</form>

नोट: यदि आप इनपुट की शायद एक तालिका को क्रमबद्ध करने की आवश्यकता है, तो आप स्ट्रिंग संघनन में जोड़ और अनुक्रमण कर सकते हैं; जोकि मैंने किया था।

app.directive('myName', function(){

  var myNameError = "myName directive error: "

  return {
    restrict:'A', // Declares an Attributes Directive.
    require: 'ngModel', // ngModelController.

    link: function( scope, elem, attrs, ngModel ){
      if( !ngModel ){ return } // no ngModel exists for this element

      // check myName input for proper formatting ex. something/something
      checkInputFormat(attrs);

      var inputName = attrs.myName.match('^\\w+').pop(); // match upto '/'
      assignInputNameToInputModel(inputName, ngModel);

      var formName = attrs.myName.match('\\w+$').pop(); // match after '/'
      findForm(formName, ngModel, scope);
    } // end link
  } // end return

  function checkInputFormat(attrs){
    if( !/\w\/\w/.test(attrs.rsName )){
      throw myNameError + "Formatting should be \"inputName/formName\" but is " + attrs.rsName
    }
  }

  function assignInputNameToInputModel(inputName, ngModel){
    ngModel.$name = inputName
  }

  function addInputNameToForm(formName, ngModel, scope){
    scope[formName][ngModel.$name] = ngModel; return
  }

  function findForm(formName, ngModel, scope){
    if( !scope ){ // ran out of scope before finding scope[formName]
      throw myNameError + "<Form> element named " + formName + " could not be found."
    }

    if( formName in scope){ // found scope[formName]
      addInputNameToForm(formName, ngModel, scope)
      return
    }
    findForm(formName, ngModel, scope.$parent) // recursively search through $parent scopes
  }
});

यह कई स्थितियों को संभालना चाहिए जहां आपको पता नहीं है कि फॉर्म कहां होगा। या शायद आपके पास नेस्टेड रूप हैं, लेकिन किसी कारण से आप इस इनपुट नाम को दो रूपों तक संलग्न करना चाहते हैं? ठीक है, बस उस नाम के रूप में पास करें जिसे आप इनपुट नाम संलग्न करना चाहते हैं।

जो मैं चाहता था, वह उन इनपुट डायनामिक मूल्यों को सौंपने का एक तरीका था जो मैं कभी नहीं जान पाऊंगा, और फिर सिर्फ $ गुंजाइश।

आप अपनी इच्छा के अनुसार और कुछ भी जोड़ सकते हैं: अधिक तालिकाएं अधिक इनपुट, नेस्टेड फॉर्म, जो आप चाहते हैं। उस प्रपत्र नाम को पास करें जिसे आप इनपुट के विरुद्ध सत्यापित करना चाहते हैं। फिर फॉर्म सबमिट पर पूछें कि क्या $ गुंजाइश.yourFormName। $ वैध है


0

यह प्रपत्र सत्यापन में अलग-अलग आने के लिए एनजी-रिपीट में नाम प्राप्त करेगा।

<td>
    <input ng-model="r.QTY" class="span1" name="{{'QTY' + $index}}" ng-pattern="/^[\d]*\.?[\d]*$/" required/>
</td>

लेकिन मुझे इसके सत्यापन संदेश को देखने में परेशानी हो रही थी इसलिए मुझे ऑब्जेक्ट कुंजी के रूप में एक चर को हल करने के लिए एनजी-इनिट का उपयोग करना पड़ा।

<td>
    <input ng-model="r.QTY" class="span1" ng-init="name = 'QTY' + $index" name="{{name}}" ng-pattern="/^[\d]*\.?[\d]*$/" required/>
    <span class="alert-error" ng-show="form[name].$error.pattern"><strong>Requires a number.</strong></span>
    <span class="alert-error" ng-show="form[name].$error.required"><strong>*Required</strong></span> 


0

यहाँ एक उदाहरण है कि मैं ऐसा कैसे करता हूं, मुझे नहीं पता कि यह सबसे अच्छा समाधान है, लेकिन पूरी तरह से काम करता है।

सबसे पहले, HTML में कोड। एनजी-क्लास को देखें, इसे हैरिस फ़ंक्शन कहते हैं। इनपुट के नाम की घोषणा भी देखें। मैं अलग-अलग इनपुट नाम बनाने के लिए $ इंडेक्स का उपयोग करता हूं।

<div data-ng-repeat="tipo in currentObject.Tipo"
    ng-class="{'has-error': hasError(planForm, 'TipoM', 'required', $index) || hasError(planForm, 'TipoM', 'maxlength', $index)}">
    <input ng-model="tipo.Nombre" maxlength="100" required
        name="{{'TipoM' + $index}}"/>

और अब, यहाँ हैहर फ़ंक्शन:

$scope.hasError = function (form, elementName, errorType, index) {
           if (form == undefined
               || elementName == undefined
               || errorType == undefined
               || index == undefined)
               return false;

           var element = form[elementName + index];
           return (element != null && element.$error[errorType] && element.$touched);
       };

0

मूल आवश्यकताओं पर पूछे गए प्रश्नों की तुलना में मेरी आवश्यकताएं थोड़ी भिन्न थीं, लेकिन उम्मीद है कि मैं किसी ऐसे व्यक्ति की मदद कर सकता हूं जो उसी समस्या से गुजर रहा है जो मैं कर रहा हूं।

मुझे परिभाषित करना था कि क्या क्षेत्र की आवश्यकता है या एक गुंजाइश चर पर आधारित नहीं है .. इसलिए मुझे मूल रूप से सेट करना पड़ा ng-required="myScopeVariable"(जो एक बूलियन चर है)।

<div class="align-left" ng-repeat="schema in schemas">
    <input type="text" ng-required="schema.Required" />
</div>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.