Angular和Flask是两个不同的技术栈，Angular是一个前端框架，Flask是一个后端框架。在进行前后端分离开发时,
可以使用Angular作为前端框架，
使用Flask作为后端框架。
1 Angular 部分:
在使用angular 之前,需要安装node.js, 并使用 npm install -g @angular/cli 安装angular
1> 创建Angular应用程序：使用Angular CLI（命令行界面）创建一个新的Angular应用程序，例如：ng new myapp。这将创建一个名为myapp的新应用程序。
2> 创建Angular组件：在Angular应用程序中，组件是呈现UI的关键部分。使用Angular CLI创建一个新的组件，例如：ng generate component mycomponent。这将在myapp/src/app目录中创建一个名为mycomponent的新组件。
3>在Angular应用程序中，使用HttpClient模块从Flask应用程序中检索数据。在mycomponent.component.ts文件中，例如：

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

@Component({
  selector: 'app-mycomponent',
  templateUrl: './mycomponent.component.html',
  styleUrls: ['./mycomponent.component.css']
})
export class MycomponentComponent implements OnInit {
  posts: any[];

  constructor(private http: HttpClient) { }

  ngOnInit() {
    this.http.get('/api/posts').subscribe(data => {
      this.posts = data['posts'];
    });
  }
}

5> 使用 `ng serve`  或者 `ng serve --port 3001` 开始运行angular
4>推荐几个常用的组件库 `angular Material`,`NGX-Bootstrap`,`Ionic`,`NG-ZORRO`

2.Flask 部分:

from flask import Flask, jsonify, request
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/api/posts', methods=['GET'])
def get_posts():
    posts = [
        {'id': 1, 'title': 'Post 1', 'content': 'This is post 1.'},
        {'id': 2, 'title': 'Post 2', 'content': 'This is post 2.'},
        {'id': 3, 'title': 'Post 3', 'content': 'This is post 3.'},
    ]
    return jsonify(posts)

@app.route('/api/posts', methods=['POST'])
def add_post():
    post = request.get_json()
    # TODO: Add the new post to the database.
    return jsonify(post)

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

在这个例子中，我们首先导入了Flask和CORS模块。然后，我们创建了一个名为app的新Flask应用程序，并使用CORS(app)启用了跨域请求。

接下来，我们定义了一个名为get_posts的API endpoint，它使用GET方法从服务器检索帖子，并返回帖子列表。我们还定义了一个名为add_post的API endpoint，它使用POST方法将新帖子添加到服务器，并返回新帖子的详细信息。

请注意，我们使用了Flask的jsonify函数将帖子数据转换为JSON格式，并使用request.get_json()函数从POST请求中提取新帖子的数据。

最后，我们使用if name == 'main’语句启动了Flask应用程序。这将使Flask应用程序在本地主机上的默认端口（5000）上运行。
当您启动Flask应用程序并在Angular应用程序中向API发送请求时，CORS中间件将允许跨域请求。请注意，CORS中间件可以配置为仅允许来自特定域的请求。