// This code sample uses the 'Unirest' library: // http://unirest.io/java.html HttpResponse<JsonNode> response = Unirest.get("https://your-domain.atlassian.net/rest/api/2/search") .basicAuth("email@example.com", "<api_token>") .header("Accept", "application/json") .queryString("jql", "project = HSP") .asJson(); System.out.println(response.getBody());
时间: 2023-02-06 10:06:43 浏览: 328
这段代码使用 Unirest 库发送了一个 HTTP GET 请求到 "https://your-domain.atlassian.net/rest/api/2/search",请求头中带有基本身份认证(使用你提供的电子邮件地址和 API 令牌)和 Accept 请求头,并在请求参数中提供了 JQL 查询 "project = HSP"。请求返回的内容会以 JSON 的形式被打印出来。
相关问题
以下三个方法已经取出了我想要的对应的数据现在想要对这些数据分别进行分页处理我应该怎么修改代码 loadAll(): void { this.approvalRecordService.queryAuditing().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.auditingApprovalRecords = res.body ?? []; }); this.approvalRecordService.queryCreated().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.createdApprovalRecords = res.body ?? []; }); this.approvalRecordService.queryAudited().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.auditedApprovalRecords = res.body ?? []; }); }
你可以使用 Angular Material 提供的 `MatPaginator` 组件来实现分页。具体实现步骤如下:
1. 在组件的 HTML 模板中,添加 `MatPaginator` 组件。例如:
```html
<mat-paginator [length]="auditingApprovalRecords.length" [pageSize]="pageSize" [pageSizeOptions]="pageSizeOptions" (page)="onAuditingPageChange($event)">
</mat-paginator>
```
其中,`length` 表示数据总数,`pageSize` 表示每页显示的数据条数,`pageSizeOptions` 表示用户可选的每页数据条数选项,`page` 事件表示当用户点击页码时的回调函数。
2. 在组件的 TypeScript 文件中,定义相应的属性和方法。例如:
```typescript
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { IApprovalRecord } from 'app/shared/model/approval-record.model';
import { ApprovalRecordService } from 'app/entities/approval-record/approval-record.service';
@Component({
selector: 'jhi-approval-record',
templateUrl: './approval-record.component.html',
})
export class ApprovalRecordComponent implements OnInit {
@ViewChild(MatPaginator) paginator!: MatPaginator;
auditingApprovalRecords: IApprovalRecord[] = [];
createdApprovalRecords: IApprovalRecord[] = [];
auditedApprovalRecords: IApprovalRecord[] = [];
pageSize = 10;
pageSizeOptions: number[] = [5, 10, 20];
constructor(private approvalRecordService: ApprovalRecordService) {}
ngOnInit(): void {
this.loadAll();
}
loadAll(): void {
this.approvalRecordService.queryAuditing().subscribe((res: HttpResponse<IApprovalRecord[]>) => {
this.auditingApprovalRecords = res.body ?? [];
this.auditingApprovalRecords.paginator = this.paginator; // 绑定分页组件
});
this.approvalRecordService.queryCreated().subscribe((res: HttpResponse<IApprovalRecord[]>) => {
this.createdApprovalRecords = res.body ?? [];
this.createdApprovalRecords.paginator = this.paginator; // 绑定分页组件
});
this.approvalRecordService.queryAudited().subscribe((res: HttpResponse<IApprovalRecord[]>) => {
this.auditedApprovalRecords = res.body ?? [];
this.auditedApprovalRecords.paginator = this.paginator; // 绑定分页组件
});
}
onAuditingPageChange(event: any): void {
this.auditingApprovalRecords.paginator = this.paginator;
}
onCreatedPageChange(event: any): void {
this.createdApprovalRecords.paginator = this.paginator;
}
onAuditedPageChange(event: any): void {
this.auditedApprovalRecords.paginator = this.paginator;
}
}
```
其中,`@ViewChild(MatPaginator) paginator!: MatPaginator` 表示获取 `MatPaginator` 组件的实例。在 `loadAll()` 方法中,将获取到的数据绑定到 `MatPaginator` 组件上。分别定义了三个回调函数 `onAuditingPageChange`、`onCreatedPageChange` 和 `onAuditedPageChange`,用来处理分页变化事件。
注意:在绑定分页组件时,需要先将获取到的数据赋值给对应的属性,再将属性绑定到分页组件上。
我现在有三种类型的数据分别是我提交的 、我审批的、待审批的 他们分别对应着三种后端查询接口 现在我要在前端一个页面内 的三个表单中分别显示他们的分页数据 前端angular代码应该怎么写 loadAll(): void { this.approvalRecordService.queryAuditing().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.auditingApprovalRecords = res.body ?? []; }); this.approvalRecordService.queryCreated().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.createdApprovalRecords = res.body ?? []; }); this.approvalRecordService.queryAudited().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.auditedApprovalRecords = res.body ?? []; }); }
你可以使用 Angular 中的 HttpClient 发起 HTTP 请求来获取数据,并在模板文件中使用 ngFor 指令进行遍历展示。以下是一个简单的示例代码:
在组件中:
```
import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app-approval-records',
templateUrl: './approval-records.component.html',
styleUrls: ['./approval-records.component.css']
})
export class ApprovalRecordsComponent implements OnInit {
auditingApprovalRecords: IApprovalRecord[];
createdApprovalRecords: IApprovalRecord[];
auditedApprovalRecords: IApprovalRecord[];
constructor(private http: HttpClient) { }
ngOnInit(): void {
this.loadAll();
}
loadAll(): void {
this.http.get<IApprovalRecord[]>('/api/approval-records/auditing').subscribe(res => {
this.auditingApprovalRecords = res;
});
this.http.get<IApprovalRecord[]>('/api/approval-records/created').subscribe(res => {
this.createdApprovalRecords = res;
});
this.http.get<IApprovalRecord[]>('/api/approval-records/audited').subscribe(res => {
this.auditedApprovalRecords = res;
});
}
}
```
在模板文件中:
```
<h2>Auditing Approval Records</h2>
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let record of auditingApprovalRecords">
<td>{{record.id}}</td>
<td>{{record.name}}</td>
<td>{{record.status}}</td>
</tr>
</tbody>
</table>
<h2>Created Approval Records</h2>
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let record of createdApprovalRecords">
<td>{{record.id}}</td>
<td>{{record.name}}</td>
<td>{{record.status}}</td>
</tr>
</tbody>
</table>
<h2>Audited Approval Records</h2>
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let record of auditedApprovalRecords">
<td>{{record.id}}</td>
<td>{{record.name}}</td>
<td>{{record.status}}</td>
</tr>
</tbody>
</table>
```
这里的实例中,我们在组件的 ngOnInit 方法中调用了 loadAll 方法来获取数据,然后分别将数据赋值给 auditingApprovalRecords、createdApprovalRecords 和 auditedApprovalRecords 数组中。接着在模板文件中使用 ngFor 指令来遍历这些数组,展示数据。
请注意,这里的代码只是一个示例,你需要根据自己的实际情况进行修改。例如,你需要根据后端接口的返回值定义 IApprovalRecord 接口。
阅读全文
相关推荐
















