Angular 4 http post请求在url中显示数据

Angular 4是一种流行的前端开发框架，用于构建现代化的Web应用程序。它基于TypeScript语言，并提供了丰富的功能和工具，使开发人员能够轻松地构建高性能、可扩展和可维护的应用程序。

在Angular 4中，可以使用HttpClient模块来进行HTTP请求。要在URL中显示数据，可以使用HTTP的GET请求来获取数据，并将其附加到URL的查询参数中。但是，由于GET请求的URL长度有限制，如果数据量较大，可能会导致URL过长而无法正常工作。因此，更常见的做法是使用HTTP的POST请求来发送数据，并将其包含在请求的正文中。

以下是使用Angular 4进行HTTP POST请求并在URL中显示数据的示例代码：

1. 首先，确保已经导入了HttpClient模块：

import { HttpClient } from '@angular/common/http';

1. 在组件中注入HttpClient：

constructor(private http: HttpClient) { }

1. 创建一个方法来发送POST请求：

postData(data: any) {
  const url = 'https://example.com/api/data'; // 替换为实际的API URL
  return this.http.post(url, data);
}

1. 在需要发送POST请求的地方调用该方法，并处理返回的数据：

const data = { name: 'John', age: 25 }; // 要发送的数据
this.postData(data).subscribe(response => {
  console.log(response); // 处理返回的数据
}, error => {
  console.error(error); // 处理错误
});

在上述示例中，我们创建了一个名为postData的方法，它接受要发送的数据作为参数，并使用HttpClient的post方法发送POST请求。在调用postData方法时，我们使用subscribe方法来订阅返回的数据，并在回调函数中处理它。

请注意，示例中的URL（https://example.com/api/data）仅用作示范，您需要将其替换为实际的API URL。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）、腾讯云对象存储（COS）、腾讯云云数据库MySQL等。您可以访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于这些产品的详细信息和使用指南。