2016-01-19 22 views
5

Tôi đang học Angular 2 và tôi đã làm theo hướng dẫn của Egghead, nhưng tôi khá mới với mọi thứ liên quan đến Angular.Sử dụng thư viện của bên thứ ba (parse.com) trong Angular 2

Bây giờ tôi muốn làm điều gì đó tiên tiến hơn và bắt đầu sử dụng Parse.com với Angular 2. Thông thường tôi sẽ đưa thư viện parse.com vào trang index.html qua <script src="//www.parsecdn.com/js/parse-1.6.2.min.js"></script>, nhưng tôi muốn viết ParseService qua Angular 2 mà tôi có thể sử dụng để quản lý chương trình phụ trợ.

Tôi dường như không thể tìm cách đưa vào và sử dụng Phân tích cú pháp trong dịch vụ tôi muốn viết. Đây là mã rất cơ bản tôi muốn sử dụng để kiểm tra việc nhập.

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('', ''); 
    } 
} 

Tôi cần một số loại nhập ở phía trên cùng của trang bao gồm màu Tây Nguyên, nhưng từ nơi tôi sẽ nhận được các thư viện cần thiết? Tôi đã thử qua npm nhưng không thành công. Bất cứ ai đã thử điều này?

+0

Bạn đã tìm hiểu cách "nhập {Parse} từ '.../...'; // <- Đây là điều tôi muốn làm"? Tôi cũng bị mắc kẹt ở đó. – Sam

+0

có xem xét câu trả lời của tôi, bạn là kịch bản cdn đã làm sai, nếu bạn cập nhật nó có thể là tôi sẽ tạo một bản demo – Aravind

Trả lời

-1

Những gì bạn cần làm là bạn cần phải tải về thư viện Parse với:

npm install parse 

Sau đó, bạn cần phải tham khảo nó trong nhập khẩu của bạn một cách đúng đắn - bạn cần phải xác định, trong đó thư mục phân tích cú pháp Tệp .js được đặt tại.

+0

Điều này không trả lời cách bạn nhập Parse trong angular2 như @ThijsM đã nêu tại "import {Parse} từ '.../...'; // <- Đây là điều tôi muốn làm " – Sam

3

uksz đã đúng. Bạn phải đầu tiên cài đặt các thành phần của lệnh

npm install --save parse 

Sau đó bạn có thể nhập nó như bất kỳ thành phần khác bằng cách gõ

import {Parse} from 'parse'; 

Để biết thêm thông nhìn vào liên kết này https://forum.ionicframework.com/t/how-to-require-xyz-in-ionic2-angular2/42042

Hy vọng nó giúp;)

CẬP NHẬT

Wit h phiên bản mới của góc tiếp cận này dừng lại để làm việc. Đây là bước tiến mới của tôi bằng cách bước: làm thế nào để sử dụng thư viện Parse trong Angular2

  1. Cài đặt phần Parse cho dự án

    npm install parse --save 
    
  2. Cài đặt loại Parse

    npm install @types/parse --save 
    
  3. nhập khẩu mô-đun Parse

    const Parse: any = require('parse'); 
    
  4. sử dụng mô-đun Parse

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

Thưởng thức nó với IntelliSense;)

0

Bạn có thể làm điều đó bằng cách sử dụng OpaqueToken trong Angular2

.Tạo một Mã thông báo được sử dụng để tìm một cá thể như dưới đây trong một tệp ts riêng biệt.

import { OpaqueToken } from '@angular/core' 

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

2. Trong bạn App.module, bạn cần phải nhập khẩu và khai báo một biến đó là tên của đối tượng cửa sổ của bạn mà làm cho Token như một dịch vụ angular2 để bạn có thể sử dụng các thuộc tính, phương thức trong tệp javascript đó trên các thành phần của bạn.

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

Bước 3: Tiêm nó để các nhà cung cấp hàng loạt các mô-đun của bạn.

{ provide : name_of_The_Token , useValue : name_Of_The_Window_Object } 

Hướng dẫn sử dụng mã này vào thành phần

  1. nhập token giống như bất kỳ dịch vụ nào khác và @Inject từ góc lõi

    import { name_of_The_Token } from '/* file_Path */'; 
    import { Inject } from '@angular/core'; 
    
  2. Trong constructor của các thành phần

    constructor(@Inject(name_of_The_Token) private _serviceObject : any)  
    
  3. Bất kỳ nơi trong thành phần của bạn, bạn có thể sử dụng các biến và phương pháp tập tin javascript của bạn như

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

Note: Một nhược điểm là bạn sẽ không nhận được IntelliSense.

Vượt qua nó: Nếu bạn đang tìm kiếm IntelliSense bạn cần phải quấn các phương pháp và các biến bên trong một giao diện và sử dụng nó trong các loại ** (thay vì có) ** mã thông báo của bạn như

export interface myCustom { 
     method1(args): return_Type; 
     method2(args): void; 
     ..... 
    } 
Các vấn đề liên quan