Динамически генерировать флаги materializecss

Question

Я динамически создаю флажки materializecss через ng-repeat. Проблема заключается в том, что в материализуются, то «за» на этикетке CheckBox должен соответствовать идентификатору на input как таковой:

<div class="checkbox-patient-info-medical"> 
    <input type="checkbox" id="medical-checkbox"> 
    <label for="medical-checkbox"> Prior Authorization Required*</label> 
</div> 

Я генерации поля с нг-повтора, и есть 1 текстовое поле для каждого сгенерированного набор полей. Код выглядит следующим образом:

<div class="medical-insurance-holder" ng-repeat="person in vm.myData[0].medicalInsuranceContainer track by $index"> 
    <p class="patient-info-holder-text"> 
    RELATIONSHIP TO PATIENT:&nbsp&nbsp&nbsp<b>{{person.relationshipToPatient}}</b> 
    </p> 
    <p class="patient-info-holder-text"> 
    GROUP NUMBER:&nbsp&nbsp&nbsp<b>{{person.groupNum}}</b> 
    </p> 
    <p class="patient-info-holder-text"> 
    SUBSCRIBER D.O.B:&nbsp&nbsp&nbsp<b>{{person.subscriberDob}}</b> 
    </p> 
    <div class="checkbox-patient-info-medical"> 
    <input type="checkbox" id="medical-checkbox"><label for="medical-checkbox"> Prior Authorization Required*</label> 
    </div> 
</div> 

Как я могу изменить label for и id этих флажков как нг-повторить их создает? Если я оставлю его как есть, я могу только щелкнуть по первому флажку.

Благодаря

Answer 1

Вы можете интегрировать текущий индекс нг-повтор в них следующий образе:

<div class="checkbox-patient-info-medical"> 
    <input type="checkbox" id="medical-checkbox{{$index}}"> 
    <label for="medical-checkbox{{$index}}"> Prior Authorization Required*</label> 
</div> 

Check скрипку: https://jsfiddle.net/twizzlers/z0meqr6h/1/

Надеется, что это помогает =)

Answer 2

мы нужны как ввод, так и метка. Чтобы генерировать флажок динамически для materializecss, используя AngularJS. Используйте приведенный ниже код для генерации флажка динамически.

 <tbody> 
     <tr ng-repeat="x in data"> 
     <td>{{x.name}}</td> 
     <td>{{x.phone}}</td> 
     <td> 
     <input type="checkbox" id="cbox{{$index}}" /> 
     <label for="cbox{{$index}}"></label> 
     </td> 
     </tr> 
    </tbody> 

Если вы не используете ярлык с, значит, вы не установите этот флажок.

Здесь CBOX будет генерировать идентификаторы, как cbox1, cbox2, cbox3 ..... cboxn