Reputation: 726
I have created a Base Model in which I have all the common functions to fetch data and post or put the data. Actually what a service does in Angular but I don't want a service.
Now what I am planning to do is The base model will extended by all the modules in my system each module having its base endpoint to get data from the API. Now here's the problem If I inject the Http service in base model and the user model extends the Base model, Now to create a object of base model I need to pass the object of Http which I am unable.
export class BaseModel {
constructor (http: Http) {}
fetch() {
let params = {
"includes": this.includes,
"page": page,
"filters" : this.filters,
"order" : this.orderDirection + this.orderColumn
};
return this.api.get("/"+this.endpoint, params)
.map(
(response: any) => {
let total = response.meta.total;
let current = response.meta.current;
let min = current - 5;
let max = current + 5;
if (min < 1) {
min = 1;
}
if (max > total) {
max = total;
}
else if (max < 10) {
if(total < 10) {
max = total;
}else {
max = 10;
}
}
let pages : number[] = [];
for (let i = min; i <= max; i++) {
pages.push(i);
}
this.pages = pages;
return response
}
);
}
}
Now my User Model
export class User extends BaseModel {
public id : number;
public username : string;
public email : string;
public password : string;
public passwordConfirmation : string;
public details : UserDetail = new UserDetail();
public type : string;
public status : string;
public profileImage : string;
public profileImageUrl : string;
public crop : Object = {};
public lastLogin : string;
public numberOfLogin : string;
public joinDate : string;
public registerType : string = "web";
public static create(response : any) {
if (response === undefined || response === null) {
return response;
}
let details = new UserDetail();
if (response.details) {
details = UserDetail.create(response.details);
}
let user = new User(); //error parameter required
user.id = response.id;
user.username = response.username;
user.email = response.email;
user.status = response.status;
user.type = response.type;
user.details.id = response.details.id;
user.details = details;
user.profileImageUrl = response.profile_image_url;
user.joinDate = response.created_at;
user.registerType = response.register_type;
return user;
}
}
Upvotes: 9
Views: 4008
Reputation: 657546
UPDATE (final)
constructor() {
let injector = ReflectiveInjector.resolveAndCreate([
Http,
BrowserXhr,
{provide: RequestOptions, useClass: BaseRequestOptions},
{provide: ResponseOptions, useClass: BaseResponseOptions},
{provide: ConnectionBackend, useClass: XHRBackend},
{provide: XSRFStrategy, useFactory: () => new CookieXSRFStrategy()},
]);
this.http = injector.get(Http);
}
ORIGINAL (RC.x)
constructor() {
let injector = ReflectiveInjector.resolveAndCreate([HTTP_PROVIDERS]);
this.http = injector.get(Http);
}
This creates a new injector (independent of the one used by the rest of your Angular2 app. This isn't necessarily a problem, you just should be aware of it.
See also angular2 resolveAndCreate HTTP - missing HTTP_PROVIDERS in RC7
Upvotes: 15
Reputation: 7022
Ugly solution which works in Angular 2.1
import {ReflectiveInjector} from '@angular/core';
import {Http, HttpModule} from "@angular/http";
const providers = (<any>HttpModule).decorators[0].args[0].providers;
const injector = ReflectiveInjector.resolveAndCreate(providers);
const http = injector.get(Http);
Upvotes: 5