2016-01-19 13 views
5

私はAngular 2を学んでいますが、すでにEggheadのチュートリアルに従っていますが、Angularに関するすべてのことはかなり新しいです。サードパーティのライブラリ(parse.com)をAngular 2で使用

今、私は通常、私は<script src="//www.parsecdn.com/js/parse-1.6.2.min.js"></script>を経由してindex.htmlページでparse.comライブラリが含まれますが、私は角度を経てParseServiceを書きたい角度2. で、より高度な何かをしてParse.comの使用を開始したいです2私はバックエンドを管理するために使用することができます。

私が書きたいサービスにParseを含める方法を見つけることができないようです。 これはインポートをテストするために使用したい非常に基本的なコードです。

import {Injectable} from 'angular2/core'; 
import {Parse} from '.../...'; // <-- This is what I want to do 

@Injectable() 
export class ParseService { 
    constructor() { 
     console.log('Creating ParseService'); 

     Parse.initialize('', ''); 
    } 
} 

私は、Parseを含むページの一番上に何らかのインポートが必要ですが、どこから必要なライブラリを入手する必要がありますか?私はすでにnpmで試しましたが、成功しませんでした。誰でもこれを試しましたか? - あなたがここで解析をフォルダに指定する必要があり

npm install parse 

はその後、あなたは正しい方法であなたのインポートでそれを参照する必要があります:あなたがする必要がどのような

+0

"{Parse}を '.../...'からインポートする方法を知りましたか?// < - これは何をしたいのですか?"私はそこにも立ち往生している。 – Sam

+0

私の答えを見て、あなたはスクリプトですcdnは間違っています。もし私がデモを作成しているかもしれません。 – Aravind

答えて

-1

は、あなたと解析ライブラリをダウンロードする必要があります.jsファイルはに配置されます。

+0

これは、あなたがangle2でParseをどうインポートするかについては答えていません。@ThijsMは "import {Parse} '.../...'; // < - これは私がやりたいことです " – Sam

3

ukszが正しくありました。最初https://forum.ionicframework.com/t/how-to-require-xyz-in-ionic2-angular2/42042

がそれを願って、このリンクを見て詳細情報については

import {Parse} from 'parse'; 

を入力して、あなたが他のコンポーネントとして、それをインポートすることができた後、コマンド

npm install --save parse 

でコンポーネントをインストールする必要があります助け;)

更新

ウィット角度の新しいバージョンでは、このアプローチは機能しなくなりました。ここではステップバイ私の新しいステップは次のとおりです。Angular2で解析ライブラリを使用する方法

  1. プロジェクトに解析コンポーネントをインストールし

    npm install parse --save 
    
  2. npm install @types/parse --save 
    
  3. 輸入解析モジュール解析の種類をインストールします。

    const Parse: any = require('parse'); 
    
  4. 使用解析モジュール

    Parse.initialize("key"); 
    ... 
    

はインテリセンスとそれをお楽しみください。)

0

あなたはAngular2

OpaqueTokenを使用していることを行うことができます。別のtsファイルで以下のようにインスタンスを見つけるために使用されるトークンを作成します。あなたのApp.module

import { OpaqueToken } from '@angular/core' 

export let name_of_The_Token = new OpaqueToken('name_Of_The_Window_Object'); 

2.、あなたはインポートする必要があり、あなたが使用できるように、angular2サービスとしてトークンを行い、あなたのウィンドウオブジェクトの名前で変数を宣言プロパティ、そのコンポーネントのjavascriptファイルのメソッド

import { name_of_The_Token } from '/* file_Path */'; 
declare let name_Of_The_Window_Object : any; //below your import statements 

ステップ3:を注入それあなたのモジュールのプロバイダの配列へ。

{ provide : name_of_The_Token , useValue : name_Of_The_Window_Object } 

ガイダンス成分

  1. インポートだけ成分

    のコンストラクタの角度コア

    import { name_of_The_Token } from '/* file_Path */'; 
    import { Inject } from '@angular/core'; 
    
  2. から他のサービスと@Inject等トークンでこのトークンを使用します

    constructor(@Inject(name_of_The_Token) private _serviceObject : any)  
    
  3. どれでもどこコンポーネントにあなたが

    this._serviceObject.method1() 
    this._serviceObject.variable1 
    ..... 
    

としてあなたのjavascriptファイルの変数とメソッドを使用することができます。一つの欠点は、あなたがインテリセンスを取得することはできませんということです。 あなたがインテリセンスを探している場合は、に必要なインタフェース内部メソッドと変数をラップし、タイプでそれを使用する**(代わりに任意のもの)**あなたのトークンの

export interface myCustom { 
     method1(args): return_Type; 
     method2(args): void; 
     ..... 
    } 
として:それを克服

関連する問題