javascript - 如何在没有表单的情况下在angularjs中提交单选框值

Question

我在两个表中显示两个 json 文件数据。我能够 console.log() 所选每行的值。我制作了一个提交按钮，但我不确定如何获取这两个值来提交它。有人可以帮助我了解如何做到这一点吗？

下面是我的两张 table

    <div class="row">
        <div class="col-md-8">
            <h1>Choose your outbound</h1>
            <table class="table">
                <tr>
                    <th>Departure</th>
                    <th>Arrival</th>
                    <th>Economy class</th>
                    <th>Business class</th>
                    <th>First class</th>
                    <th></th>
                </tr>
                <tr ng-repeat="outbound in outbounds" ng-class="{active : isSelected(outbound)}" ng-click="setMaster(outbound)">          
                    <td>{{ outbound.departure }}h</td>
                    <td>{{ outbound.arrival }}h</td>
                    <td>{{ outbound.ecoPrice }}</td>
                    <td>{{ outbound.businessPrice }}</td>
                    <td>{{ outbound.firstPrice }}</td>
                    <td>
                        <input type="radio" name="radioOutbound">
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <div class="row">
        <div class="col-md-8">
            <h1>Choose your inbound</h1>
            <table class="table">
                <tr>
                    <th>Departure</th>
                    <th>Arrival</th>
                    <th>Economy class</th>
                    <th>Business class</th>
                    <th>First class</th>
                    <th></th>
                </tr>
                <tr ng-repeat="inbound in inbounds" ng-class="{active : isSelected(inbound)}" ng-click="setMaster(inbound)">  
                    <td>{{ inbound.departure }}h</td>
                    <td>{{ inbound.arrival }}h</td>
                    <td>{{ inbound.ecoPrice }}</td>
                    <td>{{ inbound.businessPrice }}</td>
                    <td>{{ inbound.firstPrice }}</td>
                    <td>
                        <input type="radio" name="radioInbound">
                    </td>
                </tr>
            </table>
            <button type="submit" ng-click="submit()">Submit</button>
        </div>
    </div>

下面是我的 AngularJS

// Inbound
$scope.isSelected = function(inbound) {
    return $scope.selected === inbound;
}

$scope.setMaster = function(inbound) {
    $scope.selected = inbound;
    console.log($scope.selected);
}

// Outbound
$scope.isSelected = function(outbound) {
    return $scope.selected === outbound;
}

$scope.setMaster = function(outbound) {
    $scope.selected = outbound;
    console.log($scope.selected);
}

// Submit
$scope.submit = function() {
    console.log($scope.selected);
}

Answer 1

将ng-model添加到单选按钮

<td>
   <input type="radio" name="radioOutbound" ng-model="radio_value1">
</td>

第二个也是

<td>
   <input type="radio" name="radioInbound" ng-model="radio_value2">
</td>

在提交函数中，您可以传递两个值

<button type="submit" ng-click="submit(radio_value1, radio_value2)" >Submit</button>

在 Controller 中

$scope.submit = function(val1, val2){
  console.log(val1, val2);
}

如果您不想在函数中传递值，则值将位于 $scope.radio_value1 和 $scope.radio_value2