在Angular动态下拉菜单中获取选中的选项

Get selected option in dynamic Angular dropdown

本文关键字：选项 获取 动态 下拉菜单 Angular      更新时间：2023-09-26

我想有一个简单的选择:

<ion-view view-title="fc" id="fcs">
  <ion-content>
    <div id="params-container">
        <select ng-model="value1" ng-options="value for value in params1 track by value" ng-change="update()"></select>
    </div>
  </ion-content>
</ion-view>

在控制器中:

angular.module('filedetails.controller', [])

.controller('FileDetailsCtrl', function($scope, $stateParams, FilesService, ProcessFileService, FCSModel) {
       $scope.params1 = ["FSC-A", "FSC-H", "FSC-W", "SSC-A"];
       $scope.update = function(){
            console.log('scope.axisX is');
            console.log($scope.axisX);
        }
});

在app.js中，我有:

.state('file-detail', {
  url: '/files/:id',
  templateUrl: 'js/files/details/template.html',
  controller: 'FileDetailsCtrl'
})

我想获得选定的值，但不知何故，当我在下拉菜单中选择一个值时，它总是输出undefined。我能做错什么吗?我用的是AngularJS v1.3.13.

你需要这样做:

<select ng-model="axisX" ng-options="value as value for value in params1" ng-change="update()"></select>

或者像这样:

<select ng-model="axisX" ng-options="value for value in params1 track by value" ng-change="update()"></select>

使用第一种方法，您将得到:

<option value="0">FSC-A</option>
<option value="1">FSC-H</option>

使用第二种方法，您将得到:

 <option value="FSC-A">FSC-A</option>
    <option value="FSC-H">FSC-H</option>

这是工作活塞

我想你的设置是错误的。您的代码可以在jsfiddle上工作，至少只要我添加ng-controller标签:https://jsfiddle.net/wg5dtb8o/

<div ng-controller="MyCtrl">
<select ng-options="value for value in params1" ng-model="axisX" ng-change="update()"></select>
</div>
相关文章：