Angular 2 - API 请求未返回 Observable，错误：未定义没有属性“length”
2016-12-03
193
异常：未捕获（在承诺中）：错误： http://localhost:3000/app/search/results/templates/search-results.component.html:88:58 中的错误，原因：无法读取未定义的属性“长度” TypeError：无法读取未定义的属性“长度”
因此，问题在于 POST 方法似乎运行正常。do() 记录了来自服务器的正确预期响应，但在 SearchService 中的 getSearchResults() 实现和 SearchResultsComponent 中的函数调用之间，某些东西失败了。 _searchResults 永远不会更新为任何值。
search.service.ts
getSearchResults(numberOfResults: number, offset: number, sortProperties?: ISort): Observable<ISearchResult[]>{
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
let searchParams = localStorage.getItem("savedSearchParameters");
return this._http.post(this._baseUrl + "customer", searchParams, options)
.do(r => console.log(r))
.map((r: Response) => r.json().data as ISearchResult[]);
}
search-results.component.ts
private _searchResults: ISearchResult[];
this._searchService.getSearchResults(this.numResultsToFetch(), this._resultOffset)
.subscribe((data: ISearchResult[]) => this._searchResults = data);
search-results.template.html
<results-table
*ngIf="_searchResults.length > 0"
(sortEvent)="onSort($event)"
[resultsPerPage]="_resultSettings.resultsPerPage"
[pageNumber]="_pageNumber"
[resultOffset]="_resultOffset"
[columnMapping]="_columnMapping"
[totalPages]="_totalPages"
[columnsToBeDisplayed]="_resultSettings.columnsToBeDisplayed"
[displayData]="_searchResults"></results-table>
2个回答
您需要将
private _searchResults: ISearchResult[];
设置为空数组，因为您的请求是异步的，所以它在开始时未定义，因此组件无法对尚未定义的对象调用 .length。
应该是：
private _searchResults: ISearchResult[] = []
Denko Mancheski
2016-12-03
在这种情况下，我将使用公共 getter 来获取
private _searchResults: ISearchSersult[];
。但您不需要为其设置值。但我很确定模板无法访问私有变量，因为它永远不会到达
$scope
。
因此，如下所示：
public get searchResults():ISearchResult[]{
return this._searchResults;
}
然后修改模板：
<results-table
*ngIf="searchResults.length > 0"
Max Allan Niklasson
2016-12-03