使用* ngFor打印JSON密鑰和值在ANGULAR 2中使用

對不起。我對Angular 2完全陌生。你可能會認爲這是重複，但我在這裏有很多問題。我已經搜索了這個問題並得到了答案，但我無法執行它。此鏈接提供了此答案的可能解決方案：Iterate over TypeScript Dictionary in Angular 2 使用* ngFor打印JSON密鑰和值在ANGULAR 2中使用

解決方案是使用管道。但是我在語法上有一些疑問，我無法找到它，所以請專家如何使用它！該解決方案不使用管道，但我仍然嘗試它的錯誤是在所有其他的方法我都試過來實現

import {Component} from 'angular2/core'; 
@Component({ 
    selector: 'component', 
    templateUrl: ` 
    <ul> 
    <li *ngFor="#key of keys();">{{key}}:{{myDict[key]}}</li> 
    </ul> 
    ` 
}) 
export class Home { 
    myDict : Dictionary; 
    constructor() { 
    this.myDict = {'key1':'value1','key2':'value2'}; 
} 
keys() : Array<string> { 
return Object.keys(this.myDict); 
} 
} 
interface Dictionary { 
[ index: string ]: string 
}

行相同：

<li *ngFor="#key of keys();">{{key}}:{{myDict[key]}}</li>

是顯示每次我嘗試時錯誤執行它。它是相同的所有時間：下#keys和下鍵（）

，這是顯示控制檯錯誤消息：

zone.js:355 Unhandled Promise rejection: Template parse errors: 
Parser Error: Unexpected token #, expected identifier, keyword, or string at   column 11 in [ngFor let #key of keys();] in [email protected]:11 (" 

<ul> 
    <li [ERROR ->]*ngFor="let #key of keys();">{{key}}:{{myDict[key]}}</li> 
    </ul> 

"): [email protected]:11 
Parser Error: Unexpected token #, expected identifier, keyword, or string at  column 11 in [ngFor let #key of keys();] in [email protected]:11 (" 

<ul> 
    <li *ngFor="let #key of keys();">[ERROR ->]{{key}}:{{myDict[key]}}</li> 
    </ul> 

"):

請建議我該怎麼做。我在這裏錯過了什麼？與鏈接中提到的其他解決方案一起顯示了同樣的錯誤。所以如果我解決了這個問題，我也可以解決其他解決方案。謝謝

來源

2016-10-16 heman123

這是改變我相信''＃語法不再被支持。我最近遇到了這個問題。使用'let key of keys'而不是'#key of keys'。這至少會讓你過去那個錯誤。 – DerekMT12

那正是我需要的！謝謝！ – heman123

使用let不# - 因爲RC.6

來源

2016-10-16 20:48:48

使用* ngFor打印JSON密鑰和值在ANGULAR 2中使用

回答

相關問題