Angular проблема Тема с getClickEvent - PullRequest
Новая
       6

Angular проблема Тема с getClickEvent

0 голосов
/ 24 марта 2020

У меня есть компоненты в Angular, один с шаблоном моего приложения, а другой с модальным. Я реализовал общий сервис для установки и получения события клика, например: 

@Injectable({
providedIn: 'root',
})
export class SharedServiceService {
  constructor() {}

  private subject = new Subject<any>();
  sendClickEvent(id) {
    this.subject.next();
  }
  getClickEvent(): Observable<any> {
    return this.subject.asObservable();
  }
}

Я хотел бы открыть модальное окно, когда я нажимаю на кнопку моего приложения, которая получает идентификатор в параметре: 

<a (click)="onOpenModal(pension.id)">  //HTML of my template
  onOpenModal(id) {
this.sharedService.sendClickEvent(id); //.ts of my template
  }

Но проблема в том, что я хотел бы получить этот идентификатор, создать новую функцию в модальном компоненте, вызвать ее в моем модальном HTML и отправить эту функцию в мой основной компонент: 

    export class ModalSupprimerComponent implements OnInit {
  clickEventsubscription: Subscription;
  constructor(private sharedService: SharedServiceService) {
    this.clickEventsubscription = this.sharedService.getClickEvent(id).subscribe(() => {}); //problem here with id
  }

  onDelete(id) {
    this.sharedService.sendClickEvent(id);
  }
  ngOnInit() {}
}

А мой модал HTML такой: 

    <button type="button" class="btn btn-primary" aria-label="Confirmer l'abandon" (click)="onDelete(id)">

Ответы [ 2 ]

0 голосов
/ 24 марта 2020

Прежде всего, вам нужно передать идентификатор субъекту: 

this.subject.next();

И там, где вы подписались на этот предмет, вы можете получить идентификатор в качестве аргумента обратного вызова: 

this.clickEventsubscription = this.sharedService.getClickEvent().subscribe((id) => {
// here you can do: 
// this.id = id; (or something else)
});

В обратном вызове вы можете делать все, что вы хотите с этим идентификатором. Например, присвойте свойству класса. Кроме того, обратите внимание, что getClickEvent не принимает никаких параметров, поэтому вам нужно удалить id, чтобы избежать ошибок Typescript.

0 голосов
/ 24 марта 2020

Вы не нажимаете id в общей сервисной функции. Попробуйте следующее 

sendClickEvent(id) {
  this.subject.next(id); // <-- push id here
}
...