Angular(Ionic)で文字を先頭から１文字ずつタイピングするように表示する方法

import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpParams, HttpHeaders} from '@angular/common/http';

import { Logs } from 'selenium-webdriver';
import { SelectMultipleControlValueAccessor } from '@angular/forms';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page implements OnInit {
  val_temp: string;
  val: any;

  constructor(private http: HttpClient) { }

  ngOnInit() {      

  const headers = new HttpHeaders()
  .set("Id", "******")
  .set("Authorization", "t\******");

  const params = new HttpParams()
  .set('query1', 'query1')
  .set('query2', 'query2');
  console.log('hi here');

  this.http.get(
  'https://******.******.com/',
  {headers,params,responseType: 'text'}
  ).subscribe(result =>{
    console.log('result',result);
    this.buffAdmin(0,result)
  })
￥

  }


buff(i,txt):Observable<any>{
  return new Observable(observer => {
    setTimeout(() => {
      console.log('in buff');
      observer.next(txt.substring(0,i+1)) 
    },300);
  })
}
buffAdmin(i,txt){
  this.buff(i,txt).subscribe((txt2:string)=> {
    this.val = txt2;
    let j = i+1;
    if (j == txt.length){
      return
    }
    this.buffAdmin(j,txt);
  })
}
  
}