Angular6 實現按鈕倒計時效果

在發送短信驗證碼的地方，為了防止用戶重復點擊（畢竟發送一次需要5分錢成本），往往會將按鈕變灰一分鍾時間，在這期間，按鈕上顯示倒計時。這個效果在最新的Angular6中利用內置的RxJS庫非常容易實現，只要幾行代碼就可以實現。RxJS（響應式擴展的 JavaScript 版）是一個使用可觀察對象進行響應式編程的庫，它讓組合異步代碼和基於回調的代碼變得更簡單。RxJS 提供了一種對 Observable 類型的實現，直到 Observable 成為了 JavaScript 語言的一部分並且瀏覽器支持它之前，它都是必要的。
以下是控制器代碼：

            import { interval } from 'rxjs';
            import { take } from 'rxjs/operators';

            const numbers = interval(1000);
            const takeFourNumbers = numbers.pipe(take(60));
            takeFourNumbers.subscribe(
              x => {
                this.paracont = (60-x)+"秒后可重發";
                this.disabledClick=true;
              },
              error => {},
              () => {
                this.paracont = "重新發送驗證碼";
                this.disabledClick=false;
             });        

HTML中的按鈕：

<button type="button" class="btn btn-primary px-4" 
[disabled]="disabledClick" (click)="getverifycode()">{{paracont}}</button>

　　系統創建了一個Observable的定時器對象，每一秒執行一次，這樣實現的異步代碼十分簡潔。需要注意的是代碼中的error => {},不能省略。