Flask rest api using python produces blank screen when accessed through angular httpClient

Question

I am trying to build a basic rest api that returns json in flask(python) and trying to host it on heroku so that I can access the api from angular httpClient. Here's the heroku api

https://testmyak.herokuapp.com/projects

The problem is that on trying to access the api using httpClient in angular, a blank page is displayed.

The angular code has no errors whatsoever because on accessing any other fake api from json-placeholder website and it populated the page perfectly.

./app.py

from flask import Flask,jsonify
app=Flask(__name__)

@app.route('/projects')
def projects():
    x=[]
    x.append({"name":"Debal",
              "gender":"male"})
    x.append({"name":"Debdut",
            "gender":"female"})
    return jsonify(x)

if __name__=='__main__':
    app.run()

./Procfile

web: gunicorn app:app

./requirements.txt

click==7.1.2
Flask==1.1.2
gunicorn==20.0.4
itsdangerous==1.1.0
Jinja2==2.11.3
MarkupSafe==1.1.1
Werkzeug==1.0.1

And here's the angular side code ./src/app/customer.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from
'@angular/common/http';
import { ICustomer } from './customer';
import { Observable } from 'rxjs';

@Injectable()

export class CustomerService {
    _url:string='https://testmyak.herokuapp.com/projects';

    constructor(private ht:HttpClient) { }
    getCustomers():Observable<ICustomer[]>{
    return this.ht.get<ICustomer[]>(this._url);
  }
}

.src/app/customer.ts

export interface ICustomer{
    gender:string,
    name:string
}

.src/app/app.component.ts

import { Component } from '@angular/core';
import { CustomerService } from
'./customer.service';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'my-app';
    myL:any[];
    constructor(private _s:CustomerService){}
    ngOnInit(){
     this._s.getCustomers().subscribe(data=>this.myL=data);

    }
}

./src/app/app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';
import { CustomerService } from
'./customer.service'
import { HttpClientModule } from
'@angular/common/http';

@NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      HttpClientModule
    ],
    providers: [CustomerService],
    bootstrap: [AppComponent]
})
export class AppModule { }

Please suggest the changes I should make in my code to make the api accessible using httpClient in angular