회 전자가 2000ms 후에 표시되지 않습니다

Question

2000 년 동안 양식 제출 후 회 전자를 보여주고 싶습니다. 설정된 시간 제한 기능을 구현했지만 2000ms 후에도 해당 기능이 작동하지 않습니다. 내가 설정 한 시간 제한 기능을 구현하는 2000 ms 동안 양식 제출 후 스피너를 보여주고 싶어하지만,이 후에도 그 함수 내에서 않을 것입니다

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>

구성 요소와 HTML의 내 코드 아래 2000ms. 타이프 라이터 기능에

Answer 1

키워드는

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