2016-05-24 6 views
0

問題があります。私はangular.jsを使って配列から適切な行を削除することもできません。私は以下のコードを説明しています。Angular.js/Javascriptを使用して必要な行を削除できません

<tr ng-repeat="d in days"> 
     <td>{{d.day_name}}</td> 
     <td> 
      <table> 
      <tbody> 
       <tr ng-repeat="answer in d.answers"> 
       <td> 
        <select class="form-control" id="answer_{{$index}}_{{$parent.$index}}_category" name="answer_{{$index}}_category" ng-model="answer.category" ng-options="cat.name for cat in listOfCategory track by cat.value" ng-change="removeBorder($index,answer.category.value,$parent.$index)" ng-init="renderWithMode($index,answer.category.value,$parent.$index,isEditMode)"> 
        <option value="">Select Category</option> 
        </select> 
       </td> 
       </tr> 
      </tbody> 
      </table> 
     </td> 
     <td> 
      <table> 
      <tbody> 
       <tr ng-repeat="answer in d.answers"> 
       <td> 
        <select class="form-control" id="answer_{{$index}}_{{$parent.$index}}_subcategory" name="answer_{{$index}}_subcategory" ng-model="answer.subcategory" ng-options="sub.name for sub in listOfSubCategory[$parent.$index][$index] track by sub.value"> 
        <option value="">Select Subcategory</option> 
        </select> 
       </td> 
       </tr> 
      </tbody> 
      </table> 
     </td> 
     <td> 
      <table> 
      <tbody> 
       <tr ng-repeat="answer in d.answers"> 
       <td> 
        <!--<input type="text" id="answer_{{$index}}_{{$parent.$index}}_comment" name="answer_{{$index}}_comment" placeholder="Add Comment" ng-model="answers.comment">--> 
        <input type="text" id="answer_{{$index}}_{{$parent.$index}}_comment" name="answer_{{$index}}_comment" placeholder="Add Comment" ng-model="answer.comment"> 
       </td> 
       </tr> 
      </tbody> 
      </table> 
     </td> 
     <td> 
      <table> 
      <tbody> 
       <tr ng-repeat="answer in d.answers"> 
       <td style="width:20px"> 
        <input ng-show="d.answers.length>1" class="btn btn-red" type="button" name="minus" id="minus" value="-" style="width:20px; text-align:center;" ng-click="removeRow(d.answers, $index)"> 
       </td> 
       <td ng-show="$last"> 
        <input type="button" class="btn btn-success" name="plus" id="plus" value="+" style="width:20px; text-align:center;" ng-click="addNewRow(d.answers)"> 
        <button type="button" id="btn" ng-click="checkAnswer(d.answers)">Check</button> 
       </td> 
       </tr> 
      </tbody> 
      </table> 
     </td> 
     </tr> 
    </tbody> 
      </table> 
     </td> 
     </tr> 

上記の表は、次のような出力を示しています。ここで

enter image description here

私は月曜日のための3行を追加していると私は真ん中の行は削除すべき要件ごとに中段に-ボタンをクリックしたとしますが、ここでは、その画面の3行目から間違ったサブカテゴリ一部を削除されますショットは以下の通りです。

enter image description here

私はまだ第二列サブカテゴリ部分が存在し、3行目サブカテゴリ部分が間違って削除process.Iは、以下の私のコントローラ側のコードを説明していますされている削除したある最初のスクリーンショットから2番目の行を削除しました。

$scope.days=[]; 
    $http({ 
     method:'GET', 
     url:"php/customerInfo.php?action=day", 
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' } 
    }).then(function successCallback(response){ 
     //console.log('day',response.data); 
    angular.forEach(response.data, function(obj) { 
     obj.answers = []; 
     $scope.addNewRow(obj.answers); 
     $scope.days.push(obj); 
    }); 
    },function errorCallback(response) { 
    }) 
    } 

    $scope.addNewRow = function(answers,hasDelete) { 
    answers.push({ 
     category: null, 
     subcategory: null, 
     comment: null, 
     hasDelete: hasDelete ? hasDelete : false 
    }); 
    }; 

    $scope.removeRow = function(answers, $index){ 
    answers.splice($index, 1); 
    //answers.splice(answers.length-1,1); 
    }; 

ここではすべてのデータが動的にバインドされています。右の行を削除する必要があります。

答えて

-1

$ indexパラメータから$を削除してみてください。

$scope.removeRow = function(answers, index){ 
answers.splice(index, 1); 
//answers.splice(answers.length-1,1); 

}

+0

私はあなた一人で行ったが、同じ問題を投げた。 – satya

関連する問題