Question

我有两个选择输入，我从控制器获得的选项。选择这两个输入时，需要有一个包含特定数据的表。在这种情况下，您需要选择公交车号码和公交车站，然后会出现一个表格，其中包含每小时的小时和分钟。我对Angular很新鲜，所以我真的不知道如何解决这个问题。到目前为止，我有这个：https://plnkr.co/edit/U7FmkwNLbxb0bmMbV561?p=preview

标记：

    <div ng-app="timeTable" ng-controller="ngCtrl">
    <section class="content">
        <section class="filter-wrapper">
            <h2>Bus No.:
            <span><select ng-model="selectedNo" ng-options="x for x in busNum"></select></span>
            </h2>
            <h4>Stop name: <span><select ng-model="selectedStop" ng-options="x for x in stopName"></select></span>
            </h4>
        </section>
        <table class="time-table">
            <tr ng-repeat="time in time">
                <th>{{time.hour}}</th>
                <td ng-repeat="minute in time.minutes">{{minute}}</td>
            </tr>
        </table>
    </section>
    <footer class="footer">

    </footer>
</div>

使用Javascript：

    var app = angular.module("timeTable", []);   
    app.controller("ngCtrl", function ($scope) {
    $scope.busNum = [1, 2, 3];
    $scope.stopName = ["Stop1", "Stop2", "Stop3"];
    $scope.time = [
        {
            hour: 7,
            minutes: [num, num, num, num]
        },
        {
            hour: 8,
            minutes: [num, num, num, num]
        }
        //And so on...
    ];
});

提前致谢。

Answer 1

您必须对数据模型进行更改。我为你做了this simple plunker。

您可以看到我为您的公交车时刻表添加了更复杂的模型。这样，您将能够实际显示引用该特定公交车号码和公交车站的时间。请记住，在我当前的示例中，只有BusNr1和BusStop1有效，但您应该能够理解并继续插入时间。

您最后可能还需要更改

$scope.busNum = [1, 2, 3];
$scope.stopName = ["stop1", "stop2", "stop3"];

到具有键和值对的对象。

来自多个下拉列表的Angularjs动态表选择

1 个答案: