用于*ngFor中每个项的循环和本地数组
用于*ngFor中每个项的循环和本地数组
提问于 2018-05-08 14:36:41
//this.http.get("https://example.com/_api/web/lists/getbytitle('ImagingDocumentTypes')/items?$select=Title,Image,Source/Title,System/Title&$orderBy=Title&$expand=Source,System&$filter=System/Title eq '" + this.item + "'").subscribe(data => {
//this.doctypes = data['value'];
//EXAMPLE OUTPUT IS:
this.doctypes = [{
"Source": [{
"Title": "Anchor (MN)"
}, {
"Title": "United Bancorp"
}, {
"Title": "Lafayette Savings Bank"
}],
"Title": "Commercial Loans",
}, {
"Source": [{
"Title": "Anchor (WI)"
}, {
"Title": "United Bancorp"
}, {
"Title": "Old National"
}],
"Title": "Checks",
}, {
"Source": [{
"Title": "Anchor (MN)"
}, {
"Title": "Anchor (WI)"
}, {
"Title": "Old National"
}],
"Title": "HR Documents",
}]
for (let i = 0; i < this.doctypes.length; i++) {
let sources = this.doctypes[i].Source;
let sourcesarr = [];
for (let i = 0; i < sources.length; i++) {
console.log(sources[i].Title)
sourcesarr.push(sources[i].Title)
console.log(sourcesarr)
}
sourcesarr.sort()
}
//}) <script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-alpha.39/angular2.dev.js"></script>
<table>
<tr>
<th class="modalheader">Document Types</th>
<th class="modalheader">Sources</th>
</tr>
<tr *ngFor="let doctype of doctypes">
<td>{{doctype.Title}}</td>
<td>
<!-- WANT EVERY SOURCE FOR EACH DOCTYPE HERE -->
</td>
</tr>
</table>
我为各种类型的文件及其来源建立了一个表格。
使用*ngFor，我循环遍历一个名为this.doctypes的对象数组，并希望获取每个doctype的源。使用公共的for循环，我可以获取使用文档类型的每个源，并将其推送到本地数组。我正在清除这个数组，并在迭代每个文档类型之后推送每个源。
但是，我不能将sourcesarr更改为全局变量(由第二个*ngFor访问)，因为它将只存储上一次迭代的文档类型的源代码。
我怎么才能解决这个问题？
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-05-08 15:14:30
如果我正确理解了你的问题，我认为这可能会有帮助。如果这有用的话，请告诉我：
<table>
<tr>
<th class="modalheader">Document Types</th>
<th class="modalheader">Sources</th>
</tr>
<tr *ngFor="let doctype of doctypes">
<td>{{doctype.Title}}</td>
<td>
<div *ngFor="let source of doctype.Source">
{{source.Title}}
</div>
</td>
</tr>
</table>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50236198
复制相关文章
相似问题
腾讯云开发者
