javascript - AngularJS - 选择选项并在函数中使用它

标签 javascript angularjs forms

我有一个 cshtml 文件,其中包含以下代码(包含从模型中获取的数据的下拉列表)

<div class="controls">
  <select ng-model="model.CountryCode" ng-change="countryChanged({{country.ISO316613LetterCode}})">
    <option ng-repeat="country in model.Countries" value="{{country.ISO316613LetterCode}}">{{country.CommonName}}</option>
  </select>
</div>

我有这个功能,我检测到从下拉列表中选择了一个国家

    $scope.countryChanged = function(){
        var countryDet = _.find($scope.model.CountryDetails, function(cd){
            console.log("countryDet");
            return cd.CountryCode === $scope.model.Country;
        });

        if(countryDet){
            $scope.model.CountryDetail = countryDet;

            // set business properties from country details
            $scope.model.DateFormat = countryDet.DefaultDateFormat;
            $scope.model.ShortDateFormat = countryDet.DefaultShortDateFormat;
            $scope.model.DateFormatJs = countryDet.DefaultJsDateFormat;
            $scope.model.LongDateFormat = countryDet.DefaultLongDateFormat;
            $scope.model.TaxCode = countryDet.SalesTaxName;
            $scope.model.Currency = countryDet.DefaultCurrencySign;
            $scope.model.AccSoftwareDateFormat = countryDet.DefaultAccSoftwareDateFormat
            $scope.model.WeightSystem = countryDet.DefaultWeightSystem
        }

        $scope.loadStates();
    };

还有另一个功能,应该在网络上显示额外的下拉菜单,显示所选国家/地区是美国还是澳大利亚

    $scope.stateVisible = function(){

        if($scope.model && $scope.model.CountryDetail){
          return $scope.model.CountryDetail.StateVisible;
        }

        return false;
    };

我的问题是,我不知道如何将选定的 LetterCode(选项值)发送到功能countryChanged,因为,我想如果我这样做,那么我将能够轻松地将状态加载到附加下拉列表中并在现场展示。

最佳答案

只需使用 ng-options这会将所选模型分配给 ng-model对于<select> 。例如

<select ng-model="model.selectedCountry" ng-change="countryChanged()"
    ng-options="country.CommonName for country in model.Countries track by country.ISO316613LetterCode">
</select>

那么,你的countryChanged()函数(以及任何其他 Controller 函数)可以使用 $scope.model.selectedCountry这将是一个完整的国家对象。

Plunker 演示 ~ http://plnkr.co/edit/tFjvT92B1itmwkRjZIbJ?p=preview

关于javascript - AngularJS - 选择选项并在函数中使用它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37129581/

相关文章:

javascript - 基本 Javascript 验证

javascript - Highcharts 在 X 轴上显示月份日期(来自 JSON 文件)。 tickInterval : not work?

javascript - 如何创建打开警告框的输入表单?

php - Codeigniter 验证表单中的数组

ruby - #<User :1123123123> 的未定义方法 `password'

javascript - 错误 : No "exports" main defined in graphql-upload/package. json

javascript - 替换功能在 ie8 ie7 中不起作用

javascript - 我们可以从 Angular Controller 获取 aspx.cs 页面中的数据吗?

javascript - 如何在AngularJS中单击按钮时获取选定的复选框

javascript - 浏览器对 Angular Material 的支持