angularjs - 使用 angularjs ng-options 和 ng-change 时发送选项对象

Question

我有一个要传递给 ng-options 的对象数组，该数组包含下一个模式中的货币对象:

[{
        "cur_iso": "ILS",
            "cur_symbol": "\u20aa",
            "cur_name_he": "\u05e9\u05e7\u05dc",
            "cur_rate_in_nis": "1.0000",
    }, {
        "cur_iso": "USD",
            "cur_symbol": "$",
            "cur_name_he": "\u05d3\u05d5\u05dc\u05e8",
            "cur_rate_in_nis": "3.8580"
    }]

我正在使用 ng-options 从这个数组中进行选择。

<select ng-model="bindCurrencyModel" ng-init="bindCurrencyModel='ILS'" 
ng-options="currency.cur_iso as currency.cur_symbol+' '+currency.cur_name_he for currency in currencies track by currency.cur_iso" 
                    ng-change="setCurrency(currency)">
</select>   

当用户更改选择时我想更新 2 个字段:bindCurrencyModel 与 cur_iso 值和 bindRateModel 与 cur_rate_in_nis 值。

所以我创建了下一个方法:

            $scope.setCurrency=function(currency){
                $scope.bindRateModel=parseFloat(currency.cur_rate_in_nis);
            };

并设置 ng-change="setCurrency(currency)"但问题是我得到:

   TypeError: Cannot read property 'cur_rate_in_nis' of undefined

另一个奇怪的行为是我在选择的开头得到了空行。

查看我创建 fiddle 的所有代码....

http://jsfiddle.net/d9esbgjf/5/

谢谢!

Answer 1

精简版如下:

更改您的 <select>标记如下:

<select ng-model="selectedCurrency" ng-init="selectedCurrency=currencies[0]" 
    ng-options="currency as currency.cur_symbol+' '+currency.cur_name_he for currency in currencies track by currency.cur_iso" 
    ng-change="setCurrency(selectedCurrency)">
</select>

更改您的 $scope.setCurrency()方法如下:

$scope.setCurrency = function (currency) {
    $scope.bindRateModel = parseFloat(currency.cur_rate_in_nis);
    $scope.bindCurrencyModel = currency.cur_iso;
};

为什么会这样？

第一个区别是我绑定(bind)了整个 currency反对新的 selectedCurrency范围属性。这使您可以访问整个对象，而不仅仅是 cur_iso。属性(property)。这使您不必查看 currencies查找完整对象的数组。

然后我改变了ng-change将整个对象传递给 $scope.setCurrency 的表达式使用它绑定(bind)到的范围属性。这允许该方法访问完整对象。

最后，你需要设置$scope.bindCurrencyModel在$scope.setCurrency()里面函数，这样它就等于您感兴趣的字段。