2016-04-15 56 views
0

工作,我有一個JSON文件類似以下內容:複選框標籤不正確用角

{ 
    "groups": [ 
     { 
      "id": "4_2_valid", 
      "title": "Valid", 
      "sections": [ 
       { 
        "id": "4_2_section", 
        "fields": [ 
               { 
          "id": "3_1_entertainment_group_0", 
          "title": "Sample title", 
          "info": "Always wrtie \"NA\" ", 
          "type": "text", 
          "size": { 
           "width": 100, 
           "height": 1 
          }, 
          "validations": { 
           "required": true, 
           "min_length": 1 
          } 
         }, 
         { 
          "id": "4_2_yes_no_questions", 
                 "title": "Select title", 
          "type": "checkbox", 
          "info": "Always select \"Yes\"", 
          "size": { 
           "width": 100, 
           "height": 1 
          }, 
          "validations": { 
           "required": true 
          }, 
          "values": [ 
           { 
            "id": 0, 
            "title": "Not Selected" 
           }, 
           { 
            "id": 1, 
            "title": "Yes" 
           }, 
           { 
            "id": 2, 
            "title": "No" 
           } 
          ] 
         }, 
               { 
          "id": "4_2_yes_no_questions", 
                 "title": "Question title", 
          "type": "date", 
          "info": "Write the suitable data", 
          "size": { 
           "width": 100, 
           "height": 1 
          }, 
          "validations": { 
           "required": true 
          } 
         }, 
               { 
          "id": "3_1_entertainment_group_0", 
          "title": "Number Title", 
          "info": "Number Instruction", 
          "type": "number", 
          "size": { 
           "width": 100, 
           "height": 1 
          }, 
          "validations": { 
           "required": true, 
           "min_length": 1 
          } 
         } 
        ] 
       } 
      ] 
     } 
    ] 
} 

我試圖用JSON文件的格式進行迭代不同類型的問題,並正確顯示它們。我已經配置了其他每個人,但複選框的問題。這裏是我有的複選框代碼:

 <div class="" ng-repeat="group in groups"> 
      <div class="" ng-repeat="section in group.sections"> 
       <div class="" ng-repeat="field in section.fields"> 
       <div class="form-group" ng-class="{ 'has-error': form.$submitted && form[field.id].$invalid }" ng-if="field.type === 'checkbox'"> 
        <label for="{{field.id}}">{{field.title}}</label> 
        <br> 
        <input type="checkbox" name="{{field.id}}" value="{{field.id}}" ng-options="value as value.title for value in field.values"> 
        <p class="form-group-note" ng-if="field.info" ng-bind="field.info"></p> 

        <div ng-show="form.$submitted" ng-cloack> 
         <span class="help-block" ng-show="form['{{field.id}}'].$error.required" ng-if="field.validations.required">Please enter a value, this field is required</span> 
        </div> 
       </div> 
</div> 
</div> 
</div> 

我認爲這應該工作,但它不能正常工作。可能是什麼問題呢?

+0

你使用領域,但它是領域? – JordanHendrix

+0

錯過了我需要放的少數片段。 – Kahsn

+0

是輸入複選框中的ng-options是正確的。 ' sreeramu

回答

1
<!--<input type="checkbox" name="{{field.id}}" value="{{field.id}}" ng-options="value as value.title for value in field.values">--> 

<label ng-repeat="value in field.values"><input type="checkbox" name="{{value.id}}" value="{{value.id}}"> {{value.title}}</label> 

我認爲你的ng選項的用法是不正確的,如果我這樣做改變你的代碼,我能夠看到輸出。