如何根据在角度js中选中的复选框获取表行值

Question

我的表格包含checkbox，radio button和input box。我无法根据选定的值获取值。

我想对所选项目进行总结

HTML代码

<table class="table">
    <thead class="thead-inverse">
        <tr>
            <th>Phases</th>
            <th>Select Phase</th>
            <th>Mark Primary Phase</th>
            <th>Enter % of efforts with respect to primary phase</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat = "phase in phase.subjects">
            <td style="text-align:left;padding-left:2px;" ng-model="phaseName">
                 {{ phase.name }}
            </td>
            <td>
                <input type="checkbox" value="{{ phase.name }} ng-model="myVar"">
            </td>
            <td>
                <input type="radio" name="optradio">
            </td>
            <td>
                <input type="number" class="form-control" id="usr">
            </td>
        </tr>
    </tbody>
</table>
<div class = "col-lg-12 col-md-12" style="margin-top:12px;" >
    <div style="text-align:center !important;">
        <div class = "col-lg-2 col-md-2" ></div>
        <div class = "col-lg-3 col-md-3" >
            <button type="button" id="btnTSBack" class="btnWidth btn btn-Back" >
               Back
            </button>
        </div>
        <div class = "col-lg-3 col-md-3" >
            <button type="button" id="btnTSBack" class="btnWidth btn btn-Back" >
               Save Draft
             </button>
        </div>
        <div class = "col-lg-3 col-md-3" >
             <button type="button" id="btnTSNext" class="btnWidth btn btn-default" >
               Next
             </button>
        </div>
    </div>
</div>

Angular.js

 var mainApp = angular.module("mainApp", []);

         mainApp.controller('phaseSelection', function($scope) {
            $scope.phase = {
               firstName: "phase",
               subjects:[
                  {name:'Startup'},
                  {name:'Environment setup'},
                  {name:'Requirement gathering'},
                  {name:'Design'},
                  {name:'Development & Unit Testing'},
                  {name:'System integration testing'},
                  {name:'Development & Unit Testing'},
                  {name:'Deployment / Rollout'},
                  {name:'Documentation – User Guide & Present'}
               ],

            };
         });

想要在选择checkbox时获取整行值。

Answer 1

不确定这是否是最佳解决方案，但您可以选择

head.next = head

https://jsfiddle.net/Aides/L4he399L/

Answer 2

创建一个属性＆＃39; IsChecked＆＃39;在＆＃39;科目＆＃39;数组，并创建方法更改复选框，如 -

Angular js -

 var mainApp = angular.module("mainApp", []);

             mainApp.controller('phaseSelection', function($scope) {
                $scope.phase = {
                   firstName: "phase",
                   subjects:[
                      {name:'Startup',IsChecked:false},
                      {name:'Environment setup',IsChecked:false},
                      {name:'Requirement gathering',IsChecked:false},
                      {name:'Design',IsChecked:false},
                      {name:'Development & Unit Testing',IsChecked:false},
                      {name:'System integration testing',IsChecked:false},
                      {name:'Development & Unit Testing',IsChecked:false},
                      {name:'Deployment / Rollout',IsChecked:false},
                      {name:'Documentation – User Guide & Present',IsChecked:false}
                   ],

                };
    $scope.checkBoxChange=function(currentrow)
    {
    if(currentrow.IsChecked==true)
    {
    // your code here
    // console.log(currentrow.name);
    }
    }
             });

现在使用此属性绑定您的复选框 -

 <input type="checkbox" ng-model="phase.IsChecked" ng-change="checkBoxChange(phase)">

您将在控制器上获得选定的行。