Вызов функции из другого компонента, не работающего с EventEmitter () - PullRequest
Новая
       55

Вызов функции из другого компонента, не работающего с EventEmitter ()

0 голосов
/ 01 октября 2019

Мне нужно вызвать функцию от компонента A к компоненту B. Я сделал сервис для пользователей service.ts

getUsers(): Observable<UserModel[]> {
return this.httpClient.get<UserModel[]>(environment.BASE_URL + this.apiurlAllUsers + "all").pipe(
  catchError(this.handleError)
);

}

И в component A я вызываю эту услугу иустановить данные для таблицы ng-bootstrap 

 getUsersInList() {
this.userService.getUsers().subscribe((data: UserModel[]) => {
  this.collectionSize = data.length;
  this.allUsers = data;
});
}

Теперь, когда я отправляю данные в component B (мой модальный блок), вызываем функцию getUsersInList() из component A

Я пытаюсь использовать @Output

component B
@Output trigger: new EventEmitter();

submitForm(){
   this.trigger.emit("hello from B");
}


 component A
 parentFn($event: string) {
console.log($event);
this.getUsersInList();
}

И ничего не произошло ...

Также я стараюсь 

@Input second: componentA
and directly call function

this.second.getUserInList() //but I get errors

Thnx

1 Ответ

1 голос
/ 01 октября 2019

Ну, я не вижу вас, htmls, но если componentA является родителем componentB, тогда должно быть что-то вроде этого: 

 <app-component-b (trigger)=functionThatIsInParent($event)>

, вот как вы передаете Output родительскому элементу.

РЕДАКТИРОВАТЬ ДЛЯ НАБЛЮДЕНИЙ:
на службе создать тему: 

public whatever = new Subject<any>();

затем Вам необходимо создать это: 

getThatObservable(): Observable<any> {
    return.this.whatever.asObservable();
}

, а также это: 

updateObservable(data) {
   this.whatever.next(data);
}

затем при отправке: 

submitForm(){ this.service.updateObservable("hello from B"); }

Затем в компоненте A: 

this.service.getThatObservable().subscribe( data => {
         // do whatever with data
      });

Конечно, это только одно из решений. Вы также можете не создавать это updateObservable и просто вызвать: 

this.service.whatever.next("hello from B");
...