角度1.xおよびイオン性1.xで/角度2ベータ10

Question

私はそうのように、依存性注入によってウィンドウオブジェクトにアクセスできます。

angular.module('app.utils', []) 

.factory('LocalStorage', ['$window', function($window) { 
    return { 
     set: function(key, value) { 
      $window.localStorage[key] = value; 
     }, 
     get: function(key, defaultValue) { 
      return $window.localStorage[key] || defaultValue; 
     } 
    }; 
}]); 

を、私は同じことを行うことができますどのように角度2で表したもの&イオン2？

Answer 1

は、あなたは何をインポートせずwindowオブジェクトを使用することができますが、ちょうどあなたのtypescriptですコードでそれを使用することにより：

import { Component } from "@angular/core"; 

@Component({ 
    templateUrl:"home.html" 
}) 
export class HomePage { 

    public foo: string; 

    constructor() { 
    window.localStorage.setItem('foo', 'bar'); 

    this.foo = window.localStorage.getItem('foo'); 
    } 
} 

あなたもそう、サービス内のwindowオブジェクトをラップすることができますが、テスト目的のためにそれを模擬することができます。

素朴な実装は次のようになります。

import { Injectable } from '@angular/core'; 

@Injectable() 
export class WindowService { 
    public window = window; 
} 

アプリケーションをブートストラップするとき、それはどこでも利用可能ですので、あなたはその後、これを提供することができます。

import { WindowService } from './windowservice'; 

bootstrap(AppComponent, [WindowService]); 

そして、ちょうどあなたのコンポーネントでそれを使用しています。

import { Component } from "@angular/core"; 
import { WindowService } from "./windowservice"; 

@Component({ 
    templateUrl:"home.html" 
}) 
export class HomePage { 

    public foo: string; 

    constructor(private windowService: WindowService) { 
    windowService.window.localStorage.setItem('foo', 'bar'); 

    this.foo = windowService.window.localStorage.getItem('foo'); 
    } 
} 

より洗練されたサービスは、メソッドをラップし、それを使用する方が快適だそう呼び出すことができます。