Как показать данные из ts compoenent в HTML compoentn ?

---

Я работаю над приложением angular 7, подключенным к web api
мои проблемные данные отображаются в браузере при нажатии правой кнопки мыши проверить
но не показываться на публике view.html
когда делают консоль.журнала этом свидетельствуют данные на ТС, но не отображать на вид

[1,1,"كود الموظف","EmployeeId","Employees",2,2,"الفرع","BranchCode","Employees",3,3,"الاسم","EmployeeName","Employees",4,4,"السن","EmployeeAge","Employees",5,5,"تاريخ الالتحاق","JoinDate","Employees",6,6,"تاريخ الميلاد","BirthDate","Employees",7,7,"الحاله","Active","Employees"]

Что я уже пробовал:

на них

RefListVal: any;

ngOnInit() {
 
    console.log('welcome');
     this.apiservice.getReferenceDataForEmployee('Employees')
    .subscribe( data=>{
     this.RefListVal = data; //SUBSCRIBE HERE
     console.log(data);

     }); 

На К Apiservice

getReferenceDataForEmployee(tablename : string):Observable<Reference[]> {
              return this.http.get<Reference[]>('https://localhost:44326/api/Reference/'+ tablename);
            }

в представлении html

<tr *ngFor = "let ref  of RefListVal.References ">
                 <!-- <td> {{ref.rownum}}</td>    -->

                 <td> {{ref.code}} </td>
                 <td> {{ref.tableName}} </td>
                 <td> {{ref.fieldName}} </td>
                 <td> {{ref.arabicCaption }} </td>
                 <td> {{ref.latineCaption }} </td>
             </tr>

---