angularjs - 单击单选按钮时进行 ajax 调用，并使用角度响应更新模型值

Question

我似乎无法找到如何进行 ajax 调用并设置 '$scope.ticker' 模型并以角度响应。基本上，这是通过 ajax 调用来获取股票的最后价格（btc_usd、btc_eur 或 btc_rur）。

这样“$scope.last”始终是选中的任何一个单选按钮的最后价格。

<label><input type="radio" name="currency" value="btc_usd" ng-model="currency"> USD</label>
<label><input type="radio" name="currency" value="btc_eur" ng-model="currency"> EUR</label>
<label><input type="radio" name="currency" value="btc_rur" ng-model="currency"> RUR</label>


$scope.ticker = quote.ticker($scope.currency).then(function(data){
    var last = data.ticker.last;

    $log.log('last', last);
    $scope.ticker = last;
    $scope.last = last;
});

app.factory('quote', function($http, $log) {
    return {
        ticker: function(currency){
            $log.log('ticker.currency', currency);
            //return the promise directly.
            return $http.get('/api/last/'+currency)
                .then(function(result) {
                    //resolve the promise as the data
                    return result.data;
                });
        }
    };
});

Answer 1

首先，我会更改ng-model为ng-model="$parent.currency".

第二 - 我们可以用ng-repeat:

HTML：

 <label ng-repeat="value in list">
       <input type="radio" name="currency" ng-model="$parent.currency" ng-value="value.name" />{{value.name}}
      </label>

当控制器：

 $scope.list = [{
    name: "USD"
}, {
    name: "EUR"
}, {
    name: "RUR"
}];

$scope.currency = 'USD';

$scope.$watch(function () {
    return $scope.currency;
},

function (newValue, oldValue) {        
    console.log(newValue);
}, true);

现在$watch你可以运行基于newValue

演示Fiddle