AngularJS：用户在下拉列表中进行选择后调用函数答案

【问题标题】：AngularJS: Call function after user makes selection in dropdownAngularJS：用户在下拉列表中进行选择后调用函数
【发布时间】：2016-10-22 18:41:59
【问题描述】：

所以我有一个下拉列表并添加了一些值，如下所示。我希望程序根据从下拉框中选择的选项来做一些事情。

angular.module('priceCalculator', [])
.controller("mainCtrl", ['$scope', function($scope) {
$scope.data = {
  availableOptions: [
    {id: 0, name: 'Please Select'},
    {id: 1, name: 'PVC Red Extra'},
    {id: 2, name: 'Alu Standard'},
    {id: 3, name: 'SKS Classic Decor'},
    {id: 4, name: 'SKS Aluminiu Alb'}
  ],

  selectedOption: {id: 0, name: 'Please Select'}
};
}]);

我想我可以用 switch 语句来做到这一点

$scope.doStuff = function() {
  switch(id from availableOptions) {
    case 0: 
    // do stuff, I want to read file based on inputs I shall also get from user
    break;
    default:
    // do stuff
  };
};

我需要怎么做？对不起，如果这对每个人来说都很容易，我真的不擅长编码

这是html部分

  <label>Select Shutter Type</label>
  <!-- Use ngOption to select shutter type -->
  <select ng-options="option.name for option in data.availableOptions track by option.id" ng-model="data.selectedOption">
  </select>

【问题讨论】：

是的，您可以这样做，现在有什么问题？

标签： javascript html angularjs switch-statement readfile

【解决方案1】：

如果我理解正确，您希望在选择更改时调用您的 doStuff 函数。您可以使用ng-change 来做到这一点：

<select 
  ng-options="option.name for option in data.availableOptions track by option.id" 
  ng-model="data.selectedOption"
  ng-change="doStuff(option)">

然后你可以像这样声明doStuff：

$scope.doStuff = function(selectedOption) {

【讨论】：