Question

我是一名核心java开发人员，现在开始学习AngularJS。我正在阅读教程页面并得到以下疑问。

示例是

的index.html

<div ng-app="invoice3" ng-controller="InvoiceController as invoice">
  <b>Invoice:</b>
  <div>
    Quantity: <input type="number" min="0" ng-model="invoice.qty" required >
  </div>
  <div>
    Costs: <input type="number" min="0" ng-model="invoice.cost" required >
    <select ng-model="invoice.inCurr">
      <option ng-repeat="c in invoice.currencies">{{c}}</option>
    </select>
  </div>
  <div>
    <b>Total:</b>
    <span ng-repeat="c in invoice.currencies">
      {{invoice.total(c) | currency:c}}
    </span>
    <button class="btn" ng-click="invoice.pay()">Pay</button>
  </div>
</div>

invoice3.js

angular.module('invoice3', ['finance3'])
.controller('InvoiceController', ['currencyConverter', function(currencyConverter) {
  this.qty = 1;
  this.cost = 2;
  this.inCurr = 'EUR';
  this.currencies = currencyConverter.currencies;

  this.total = function total(outCurr) {
    return currencyConverter.convert(this.qty * this.cost, this.inCurr, outCurr);
  };
  this.pay = function pay() {
    window.alert("Thanks!");
  };
}]);

finance3.js

angular.module('finance3', [])
.factory('currencyConverter', ['$http', function($http) {
  var YAHOO_FINANCE_URL_PATTERN =
        '//query.yahooapis.com/v1/public/yql?q=select * from '+
        'yahoo.finance.xchange where pair in ("PAIRS")&format=json&'+
        'env=store://datatables.org/alltableswithkeys&callback=JSON_CALLBACK';
  var currencies = ['USD', 'EUR', 'CNY'];
  var usdToForeignRates = {};

  var convert = function (amount, inCurr, outCurr) {
    return amount * usdToForeignRates[outCurr] / usdToForeignRates[inCurr];
  };

  var refresh = function() {
    var url = YAHOO_FINANCE_URL_PATTERN.
               replace('PAIRS', 'USD' + currencies.join('","USD'));
    return $http.jsonp(url).success(function(data) {
      var newUsdToForeignRates = {};
      angular.forEach(data.query.results.rate, function(rate) {
        var currency = rate.id.substring(3,6);
        newUsdToForeignRates[currency] = window.parseFloat(rate.Rate);
      });
      usdToForeignRates = newUsdToForeignRates;
    });
  };

  refresh();

  return {
    currencies: currencies,
    convert: convert,
    refresh: refresh
  };
}]);

在finance3.js中，我不清楚何时调用refresh（）方法。在'currencyConverter'服务的函数（$ http）中有一个调用refresh（）。但是什么时候会调用这个语句？我只看到我们从InvoiceController调用convert（）。但是没有调用刷新方法。

Answer 1

你的代码'finance3'中的

在你的html代码中不是你ng-app的名字，因此我不理解你的代码。有关工厂实施及其使用的mora信息我建议您仔细阅读本指南Angular Style Guide是一个非常好的指南代码示例指南。我建议在你的控制器中实现刷新。问候D

Answer 2

这里的想法是我们需要在创建服务时获取一些外部货币数据。我们还希望能够在应用程序的某个稍后点刷新此数据。

然后有意义的是创建一个函数refresh，我们在首次调用服务时调用一次，正如您通过调用refresh()注意到的那样。然后，我们将refresh函数公开为服务方法，因此服务的任何用户都可以请求服务更新它的数据。

Answer 3

AngularJS服务/工厂与Java Singleton的工作方式相同。所以当你的控制器初始化时 -

里面的代码

angular.module('finance3', [])
.factory('currencyConverter', ['$http', function($http) {

将被执行。它定义了currencies数组和2个函数。 refresh()被调用一次。（您可能应该在以后需要更新时启动它。）

以下是此服务的Java模拟：

public class Finance3 {
  public static Finance3 INSTANCE = new Finance3();

  public String[] currencies;
  public Map<String, String> usdToForeignRates;

  private Finance3() {
    refresh();
  }

  private void refresh() {
    new Thread(new Runnable(public void run() {
        usdToForeignRates = Http.get(...)
    })).start();
  }
}

AngularJS $服务方法调用

3 个答案: