使用ng-repeat检索选定的选项angularJS

时间:2018-03-04 18:54:52

标签: javascript html angularjs angularjs-ng-repeat angularjs-select

我正在尝试使用AngularJS从HTML视图中检索所选选项,但我找不到方法,因为我看到的所有解决方案都考虑了参数“value”,但我没有在这里,因为我事先并不知道选项列表的内容。

以下是HTML代码:

<h5>Satellite selection</h5>
<div>
<select  id="selectedSatellite">

    <option ng-repeat="sat in passes">
        {{sat.SAT_NAME}}
    </option>

</select>
</div>

提前致谢。

2 个答案:

答案 0 :(得分:3)

使用以下代码。 ng-options指令根据提供的数组自动创建option元素。 ng-model检索所选值

<select ng-model="selectedName" ng-options="sat.SAT_NAME for sat in passes">
</select>

另见以下示例:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.names = ["Emil", "Tobias", "Linus"];
    $scope.selectedName = "";
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<div ng-app="myApp" ng-controller="myCtrl">
<h3>Selected Value : {{selectedName}}</h3>
<select ng-model="selectedName" ng-options="x for x in names">
</select>

</div>

答案 1 :(得分:1)

您可以使用ng-model指令获取控制器中的选定值。

<div>
<select ng-model="selected"  id="selectedSatellite">

    <option ng-repeat="sat in passes">
        {{sat.SAT_NAME}}
    </option>

</select>
</div>