0

I have the following code that works except for the part where I try to add the ng-messages (they don't display). From my understanding, the ng-messages attaches to the name element. What am I doing wrong here?

<form ng-submit="submit(form)" name="form">
   <div ng-repeat="question in questions">
      <div ng-switch="question.type">
         <div ng-switch-when="text">
            <md-input-container class="md-block">
               <label>{{question.title}}</label>
               <input md-maxlength={{question.maxLength}}
                      required md-no-asterisk
                      name="questionStorage[question.id]"
                      ng-model="questionStorage[question.id]">
               <div ng-messages="form[questionStorage[question.id]].$error">
                   <div ng-message="required">This is required.</div>
...
georgeawg
  • 48,608
  • 13
  • 72
  • 95
  • 1
    I would not use an editable model value for that. I'd recommend something like setting the `name` of your `` to `question_$index` and then using `form.question_$index.$error` for your `ng-messages`. – Lex Dec 17 '19 at 23:52

1 Answers1

0

With the help of Lex and Angular dynamically set ng-messages to name attribute I found the answer to be:

<form ng-submit="submit(form)" name="form">
   <div ng-repeat="question in questions">
      <div ng-switch="question.type">
         <div ng-switch-when="text">
            <md-input-container class="md-block">
               <label>{{question.title}}</label>
               <input md-maxlength={{question.maxLength}}
                      required md-no-asterisk
                      name="question{{$index}}"
                      ng-model="questionStorage[question.id]">
               <div ng-messages="form['question' + $index].$error">
                   <div ng-message="required">This is required.</div>
...

Thanks!