3

誰かが私のために何かを明確にしてくれることを願っています。私が現在行っていること、Angular 1.4.6 での作業:

サービスを作成します

'use strict';
angular.module('App')
.factory('processingService', ['$http',
    function ($http) {
        var settings = 'Settings/GetSettings';    
        var getSettings = function()
        {
            return $http.get(settings)
                .then(function(response)
                {
                    return response.data;
                });
        };
        return {
            getSettings: getSettings           
        };
    }
]);

そして、それをコントローラーで使用/注入します。

'use strict';
angular.module('App')
.controller('appController', [
    '$scope','appService',
    function ($scope, appService) {     
        var onSettings = function (data) {
            if (data.hasOwnProperty('Settings')) {    
                //Code handling Settings          
            }
        };
        var onSettingsError = function()
        {
           //Handle Errors
           $scope.showLoader = false;
        };      
        appService.getSettings()
            .then(onSettings, onSettingsError);
}]);

angular2ベータ版を少しいじり始めたところ、http.getで次の例が見つかりました

getRandomQuote() {
  this.http.get('http://localhost:3001/api/random-quote')
    .map(res => res.text())
    .subscribe(
      data => this.randomQuote = data,
      err => this.logError(err),
      () => console.log('Random Quote Complete')
    );
}

logError(err) {
  console.error('There was an error: ' + err);
}

私はいくつかの他の方法を構築し、少しテストし、グーグルで検索しましたが、angular2 beta と typescript を使用してサービスを作成する際に、今まで行っていた方法と同様のものを見つけることができませんでした。そのようにする必要さえありますか？それとも、これは Angular2 ベータ版で現在行われている方法ではないのでしょうか?

前もって感謝します。

4

2 に答える 2

2

サービスから観測可能なオブジェクト (メソッドが返すもの) を返すだけです。つまり、次のアノテーションhttp.getを持つクラスです。Injectable

@Injectable()
export class CompanyService {
  constructor(http:Http) {
    this.http = http;
  }

  getRandomQuote() {
    return this.http.get('http://localhost:3001/api/random-quote')
                  .map(res => res.json());
  }
}

コンポーネント内で、このサービスを挿入して、HTTP リクエストを実際に実行するメソッドを呼び出すことができます。結果を取得するには、次のsubscribeメソッドを使用します。

export class CompanyList implements OnInit {
  public companies: Company[];

  constructor(private service: CompanyService) {
    this.service = service;
  }

  logError(err) {
  }

  ngOnInit() {
    this.service.getRandomQuote().subscribe(
      data => this.randomQuote = data,
      err => this.logError(err),
      () => console.log('Random Quote Complete')
    );
  }
}

このアドレスで詳細を確認できます: How to Consume Http Component effective in a service in angular 2 beta? .

それがあなたを助けることを願っています、ティエリー

于 2015-12-29T15:55:31.917 に答える