Друзья, прошу помощи именно в исправлении и корректировки МОЕГО кода, ссылки мне не помогают, я уже замучался и запутался делать по примерам с ссылок, так как в примере все иначе, а подстроить под себя в точности не выходит. Буду крайне благодарен за помощь!
Задача - ввожу через инпут в одной компоненте, строка должна уходить через сервис в другой компонент и вызываться запрос к API параметром с этой новой строкой. У меня что-то идет не так - кажется строка не доходит.
Компонента где ввожу инпут:
import { Component, OnInit, Input, EventEmitter} from '@angular/core';
import { HttpService } from '../http.service'
@Component({
selector: 'search',
templateUrl: './search.component.html',
styleUrls: ['./search.component.scss']
})
export class SearchComponent{
InputFilm: string;
constructor(private httpService: HttpService){
this.httpService.InputFilm.subscribe(film => this.InputFilm = film)
}
handlerEnterSearch(){
this.httpService.setInputFilm(this.InputFilm);
this.httpService.getFilms().subscribe(data =>{
this.httpService.setFilmsData(data)
console.log('data: ', data);
});
}
ngOnInit(){}
}
Компонента где получаю:
import { Component, OnInit } from '@angular/core';
import { HttpService } from '../http.service'
@Component({
selector: 'result',
templateUrl: './result.component.html',
styleUrls: ['./result.component.scss']
})
export class ResultComponent implements OnInit {
films:any;
constructor(private httpService: HttpService){
this.films = this.httpService.films
}
ngOnInit() {}
}
И сервис:
import {Injectable} from '@angular/core';
import {EventEmitter} from '@angular/core';
import {HttpClient,HttpParams} from '@angular/common/http';
import {Observable} from 'rxjs';
import { map } from 'rxjs/operators';
@Injectable()
export class HttpService{
baseURL: string = "https://api.themoviedb.org/3";
searchURL: string = "/search/movie"
currentInputFilm: string;
films: any
InputFilm:EventEmitter<any> = new EventEmitter();
constructor(private http: HttpClient){ }
setInputFilm(inputFilm:string){
this.currentInputFilm = inputFilm
console.log('this.inputFilm: ', this.currentInputFilm);
}
setFilmsData(data){
this.films = data
}
getFilms(){
const params = new HttpParams().set('api_key', 'd6a5ac2d3d7cab11a084ca8080421b20').set('query', this.currentInputFilm)
const options = {params: params};
return this.http.get(this.baseURL+this.searchURL, options)
}
}
Пожалуйста, кому не сложно потратить пару минут на помощь, напишите что и где исправить.