2000ms後にスピナーが表示されない

Question

設定されたタイムアウト機能を実装していますが、2000ms後もその機能には入っていないため、フォーム提出後にスピナーを表示します。私は、設定されたタイムアウト機能を実装しているが、それは後であっても、その関数の内部で起こっていないことのために2000ミリ秒のためのフォーム送信後にスピナーを表示するコンポーネントとhtml

import { Component, OnInit } from '@angular/core'; 
 
import { DataService } from '../../../shared/services/data.service'; 
 
import { Router } from '@angular/router'; 
 

 
@Component({ 
 
    selector: 'app-dummy', 
 
    templateUrl: './dummy.component.html', 
 
    styleUrls: ['./dummy.component.scss'] 
 
}) 
 
export class DummyComponent implements OnInit { 
 
    loading= false; 
 
    users= []; 
 
    pinId; 
 
    name: string; 
 
    constructor(private router: Router, private dataService: DataService) { 
 
    } 
 

 
    ngOnInit() {} 
 

 
    submit(name) { 
 
    this.loading = true; 
 
this.dataService.getUsers().subscribe(data => { 
 
    this.users = data; 
 
    console.log(this.users); 
 
this.users.forEach(element => { 
 
    console.log(element); 
 
    if (element.name === this.name) { 
 
    this.pinId = element.pinId; 
 
    console.log(this.pinId); 
 
setTimeout(function() { 
 
console.log(this.pinId); 
 
         if (this.pinId) { 
 
          this.loading = false; 
 
          this.router.navigate(['schedule']); 
 
         } 
 
         }, 2000); 
 
    } 
 
}); 
 
    }, error => { 
 
    console.log('error'); 
 
    }); 
 

 
} 
 

 

 
}

<mat-card> 
 
<div class="example-container"> 
 
    <mat-form-field color="accent"> 
 
    <input matInput placeholder="Input" [(ngModel)]="name"> 
 
    </mat-form-field> 
 
    <button mat-raised-button color="accent" (click)="submit(name)">Submit</button> 
 
<mat-spinner *ngIf="loading" color="accent"></mat-spinner> 
 
</div> 
 
</mat-card>

の私のコードスニペット以下 2000ms。

Answer 1

typescriptです機能では、キーワードは、それがために働いている場合（（）=> { 'の代わりに）のsetTimeout（関数（ `の

setTimeout(()=> { 
console.log(this.pinId); 
         if (this.pinId) { 
          this.loading = false; 
          this.router.navigate(['schedule']); 
         } 
         }, 2000);