focus () на элементе contentEditable в Angular не работает - PullRequest
Новая
       5

focus () на элементе contentEditable в Angular не работает

0 голосов
/ 23 января 2020

Каждый раз, когда обновляется массив машин и обновляется пользовательский интерфейс, я теряю фокус на названии карты и не могу перефокусироваться на нем:

Machine.Component. html: 

<mat-card-title #rxjsSelector contentEditable="true" [textContent]="name" (input)="title=$event.target.textContent">
    Name:{{name}}</mat-card-title>

Machine.Component.ts: 

  @ViewChild('rxjsSelector', { static: false }) titleElement: ElementRef;

  ngAfterViewInit() {
    fromEvent(this.titleElement.nativeElement, 'keyup')
      .subscribe(res => {
          this.socket.sendMessageChange({ id: this.id, name: this.name });
          this.titleElement.nativeElement.focus(); ///// NOT WORKING
          //tried also .open() or click();
      });
  }

MachineList.component. html: 

<mat-card *ngFor="let m of machines; let i = index" class="flex-item">
    <app-machine [name]="m.name" [id]="m.id"></app-machine>
</mat-card>

MachineList.Component.ts: 

private machines: Machine[] = [];
ngOnInit() {
    this.scoketService.getMessage().subscribe(m => {
      let index = this.machines.findIndex(localM => {
        return m.id === localM.id;
      });
      if (index === -1) {
        this.machines.push(m);
      } else {
        this.machines[index] = m;
      }
    });}
...