angular - Angular - Angular 7 中的服务器端分页错误
问题描述
我正在使用 Angular 7 前端和 Laravel 后端来构建一个应用程序。我想在我的页面上进行服务器端分页,我的灵感来自分页链接
Laravel 后端
public function indexSmsmo()
{
if(Auth::user()->id == 1)
$smsmos = Smsmo::paginate(5);
else
$smsmos = Smsmo::where('user_id',Auth::user()->id)->paginate(5);
return $smsmos;
}
如上所示,我从 Laravel 后端启动它。然后继续 Angular
角度:
型号:smsmo.ts
export class Smsmo {
id: number;
msisdn: string;
message: string;
short_code_called: string;
packaged_id: string;
error_message: string;
error_code: string;
telco: string;
user_id: number;
user?: User;
telcoId?: Telco;
package?: Package;
constructor() {}
}
服务:smsmo.service.ts
// App import
import { Smsmo } from '../models/smsmo';
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { catchError } from 'rxjs/operators';
import { Ng4LoadingSpinnerService } from 'ng4-loading-spinner';
import { environment } from 'src/environments/environment.prod';
import { HttpErrorHandler, HandleError } from '../shared/_services/http-handle-error.service';
@Injectable({
providedIn: 'root'
})
export class SmsmoService {
private readonly apiUrl = environment.apiUrl;
private smsmoUrl = this.apiUrl;
private handleError: HandleError;
constructor(
private http: HttpClient,
httpErrorHandler: HttpErrorHandler ) {
this.handleError = httpErrorHandler.createHandleError('SmsmoService');
}
/** GET smsmos from smsmos endpoint */
getSmsmos (page): Observable<Smsmo[]> {
return this.http.get<Smsmo[], page>(this.smsmoUrl + '/indexSmsmo')
.pipe(
catchError(this.handleError('getSmsmos', []))
);
}
问题是,为什么我在服务中出现红线错误,我该如何解决。我的意思是如何将页面集成到我的 server.ts 中。有关详细信息,请参见图表。
解决方案
在我看来,变量page
是您想要从服务器端获得的页数。它不是type/interface
。
所以你不能用你的请求的返回类型来写它。您必须将它作为永久链接或查询方法与您的服务器一起传递。例如
getSmsmos (page): Observable<Smsmo[]> {
return this.http.get<Smsmo[]>(this.smsmoUrl + '/' + page)
.pipe(
catchError(this.handleError('getSmsmos', []))
);
}
推荐阅读
- wordpress - 带有单选按钮的 Wordpress 自定义小部件
- php - 复选框、表单提交以及如何在循环中正确使用 array_fill?
- jsx - 在设置 onClick 的 jsx 中循环
- netbeans - 输入新示例的属性值以使用 Netbeans 将其标签预测为 RapidMiner Process
- java - .hasNext() 和 .next() 导致无限循环
- tensorflow - 在 keras 的 model.fit 中随机播放
- python - TensorFlow:SparseSoftmaxCrossEntropyWithLogits 错误?
- memory - CUDA - 固定内存与可分页内存的权衡
- javascript - .indexOf javascript中的多行
- php - 根据 WooCommerce 中的产品或类别隐藏特定的运输选项