relationship is not clear, what is the problem?
1.Quote.service
import { Injectable, Inject } from "@angular/core";
import { Observable } from "rxjs/Observable";
import { Http } from "@angular/http";
import { Quote } from "../domain/quote.model";
@Injectable()
export class QuoteService {
constructor(private http: Http, @Inject("BASE_CONFIG") private config) {}
getQuote(): Observable<Quote> {
const uri = `${this.config.uri}/quotes/${Math.floor(Math.random() * 10)}`;
return this.http.get(uri)
.map(res => res.json() as Quote);
}
}
2.login.component.ts
import { Component, OnInit } from "@angular/core";
import { QuoteService } from "../../services/quote.service";
import { Quote } from "../../domain/quote.model";
@Component({
selector: "app-login",
templateUrl: "./login.component.html",
styleUrls: ["./login.component.scss"]
})
export class LoginComponent implements OnInit {
quote: Quote = {
"cn": "",
"en": "English.",
"pic": "/assets/img/quotes/1.jpg"
};
constructor(private QuoteService$: QuoteService) {
this.QuoteService$
.getQuote()
.subscribe(q => this.quote = q);
}
ngOnInit() {
}
}
3. Core.module.ts fragments imported into app.module.ts:
providers: [
{
provide: "BASE_CONFIG", useValue: {
uri: "http://localhost:3000"
}
}
]