Tìm kiếm trang web

typescript - Tiêm các dịch vụ vào một dịch vụ khác trong angular 2


Tôi đã thử tiêm một dịch vụ vào dịch vụ khác bằng DI của Angular 2

import {HttpService} from 'scripts/httpService';
export class CurrentBlog{
    constructor(public httpService:HttpService){}
}

Khi tôi làm điều này, tôi nhận được lỗi này:

Không thể giải quyết tất cả các tham số cho CurrentBlog(?). Hãy đảm bảo rằng tất cả chúng đều có kiểu hợp lệ hoặc chú thích.

Tôi đã thử DI với các thành phần bình thường và nó hoạt động tốt. Nhưng khi tôi tiêm nó vào dịch vụ, nó đơn giản là không hoạt động.

Câu trả lời #1

Trong Angular 2 bạn cần làm cho bộ tiêm của Angular nhận biết dịch vụ của bạn. Để làm điều này bạn cần đánh dấu dịch vụ là Injectable.

HttpService

import {Injectable} from 'angular2/angular2';

@Injectable()
export class HttpService{
    ...
}

CurrentBlog

import {HttpService} from 'scripts/httpService';
import {Inject} from 'angular2/core';

export class CurrentBlog{

    constructor(public httpService:HttpService){}
}

Câu trả lời #2

Trong trường hợp này chỉ DI sẽ không đủ. Liên kết dưới đây đề cập đến cùng một vấn đề:

http://blog.thoughtram.io/angular/2015/09/17/resolve-service-dependencies-in-angular-2.html

Vì vậy nó nói:

TypeScript tạo metadata khi tùy chọn emitDecoratorMetadata được bật. Tuy nhiên, điều đó không có nghĩa là nó tạo metadata một cách mù quáng cho mọi lớp hay phương thức trong mã của chúng ta. TypeScript chỉ tạo metadata cho một lớp, phương thức, thuộc tính hoặc tham số phương thức/constructor khi một decorator thực sự được gắn vào phần mã đó. Nếu không, một lượng lớn mã metadata không sử dụng sẽ được tạo ra, điều này không chỉ ảnh hưởng đến kích thước tệp mà còn tác động đến thời gian chạy của ứng dụng của chúng ta.

Vì vậy để thực thi Tạo Metadata, chúng ta có thể thử đặt một trong hai chú thích sau:

import {HttpService} from 'scripts/httpService';
import {Inject} from 'angular2/core';
export class CurrentBlog{

constructor(@Inject(HttpService) public httpService:HttpService){}
}

Hoặc,

import {Injectable} from 'angular2/core';
import {HttpService} from 'scripts/httpService';
@Injectable()
export class CurrentBlog{

constructor(public httpService:HttpService){}
}

Bài viết liên quan