我正在尝试在Angular 2 Alpha 28中做一些事情,并且我遇到了字典和NgFor的问题.
我有一个TypeScript接口,如下所示:
interface Dictionary {
[ index: string ]: string
}
在JavaScript中,这将转换为数据可能如下所示的对象:
myDict={'key1':'value1','key2':'value2'}
我想迭代这个并尝试这个:
<div *ngFor="(#key, #value) of myDict">{{key}}:{{value}}</div>
但无济于事,以下都没有:
<div *ngFor="#value of myDict">{{value}}</div>
<div *ngFor="#value of myDict #key=index">{{key}}:{{value}}</div>
在所有情况下,我都会收到"意外令牌"或"无法找到'iterableDiff'管道支持对象"之类的错误
我在这里错过了什么？这不可能了吗？(第一种语法适用于Angular 1.x)或者是迭代对象的语法是不同的？
我正在思考这个问题,但无法找到任何解释.
将参数传递给Angular2中的Component时
特定
<my-component [attr]="someModelVariable"></my-component>
似乎有两种接受attr bound值的方法:
@Component{(
selector: "my-component",
inputs: ["attr"]
)}
export class MyComponent {
}
或者你这样做:
@Component{(
selector: "my-component"
)}
export class MyComponent {
@Input()
public attr: any;
}
我实际上已经看到同时使用两者的代码,有人可以解释它们之间的区别是什么吗？
/里卡德
我有一个解决导入静态内容并在模板中使用它的问题的方法，但我不确定它是否正确，所以我想听听是否有官方/更好的方法来做这件事。
这是示例，包含相关部分和我当前的解决方案。
常量.ts
export const ELEMENT_TYPES = { FIELD: {...}, GROUP: {...} ...};
组件.ts
import {ELEMENT_TYPES} from "./constants";
@Component({
...
templateUrl:"./template.html"
})
export class myComponent{
public type = ELEMENT_TYPES.GROUP;
public get ELEMENT_TYPES() {
return ELEMENT_TYPES;
}
public isOfType(matchType){
return this.type === matchType;
}
...
}
模板.html
<div *ngIf="isOfType(ELEMENT_TYPES.FIELD)">
...
</div>
当然在真正的实现中类型是从另一个地方设置的（它在通过输入发送下来的元数据对象中）
我担心的是使用与导入的常量名称相同的属性 getter 名称。但是如果我不创建 getter，我将无法访问模板中的常量。我想在模板中访问与组件类中同名的常量 ELEMENT_TYPES。
这个问题对于以这种方式导入的类、函数和变量是一样的。（例如，我们有静态库类（不是服务），有时需要从模板中使用）
当然，我对看待问题的另一种方式持开放态度，例如有没有更好的方法来打包常量和类（我们没有以这种方式导入的函数）以从模板和组件类访问它们通过同名。