Anuglarでタグが正しく機能しない

Question

Angularを使用してフォームを作成しています。私のフォームには があり、タグとしてselectのタイプがあります。以下は

は私のコードです：

 <div class="form-group" ng-class="{ 'has-error': form.$submitted && form['{{field.id}}'].$invalid }" ng-if="field.type === 'select'"> 
      <select> 
        <div class="" ng-repeat="value in field.values"> 
         <option value="">{{value.title}}</option> 
        </div> 
      </select> 
     </div> 

そして、ここでfield.valuesためのJSONファイルです：

"values": [ 
           { 
            "id": 0, 
            "title": "Not Selected" 
           }, 
           { 
            "id": 1, 
            "title": "Yes" 
           }, 
           { 
            "id": 2, 
            "title": "No" 
           } 
          ] 

のJavascript（変更が行われ）：

app.controller（ 'I129Ctrl' 、 '$ scope'、 '$ http'、 'JSONModelsService'、 関数（$ scope、$ http、JSONModelsService）{

var formData = {}; 

    $scope.groups = []; 
    $scope.sections = []; 
    $scope.fields = []; 

    //below is basically equivalent to routing 
    JSONModelsService.get(['test', 'Valid Passport']) 
     .then(function (response) { 
      console.log(response); 
      // $scope.group = response.data.groups[0]; 
      $scope.groups = response.data.groups; 
      $scope.sections = $scope.groups.sections; 
      $scope.fields = $scope.groups.sections.fields; 
     }); 

基本的には、まずfield.typeがselectと等しいかどうかを確認します。もしそうなら、私は選択されたタイプの質問で値を求めたい。しかし、それは私が想像するように働いていません。私は間違って何をしていますか？

Answer 1

最初にdiv要素を選択に使用しないでください。これは機能しません。あなたはオプションレベルでng-repeatを置くことができますが、ng-modelはこれにバインドされていないので動作しません。

これを行う方法は、selectタグのng-optionsです。

<select ng-model="valueSelected" ng-options="value as value.title for value in field.values"></select> 

ユーザーが値を選択/選択解除できないようにする場合は、次のオプションを選択して追加してください：

<option ng-value="null">-- No value--</option>