属性绑定中的Access Map

Question

我试图访问Map中的一个值，并将其设置为div标记上的属性值，但似乎不起作用。我的语法可能不准确。我做错了什么？

<div [style.background-color]="bgcolor" width="50px" height="50px"> Hello Green</div>
<div [style.background-color]="bgcolors['a']" width="50px" height="50px"> Hello Red</div>

在我的组件中，我有这样的：

bgcolor= "green";
bgcolors:  Map<string,string>;
bgcolors = new Map<string,string>();
bgcolors.set("a", "red");

这是一把小提琴。第一个有效，第二个无效。

Answer 1

请尝试以下操作。CCD_ 1函数并没有起到以防万一的作用。此外，要访问Map中的项目，请使用bgcolors.get(key)函数。

let { Component, NgModule } = ng.core;
@Component({
selector: 'my-app',
template: `
<div [style.background-color]="bgcolor" width="50px" height="50px"> Hello Green</div>
<div [style.background-color]="bgcolors.get('a')" width="50px" height="50px"> Hello Red</div>
`,
})
class HomeComponent {
bgcolor= "green";
bgcolors:  Map<string,string>;
bgcolors = new Map<string,string>();

name = 'Angular 2';
constructor() {
this.bgcolors.set("a", "red");
}
}
const { BrowserModule } = ng.platformBrowser;
@NgModule({
imports:      [ BrowserModule ],
declarations: [ HomeComponent ],
bootstrap:    [ HomeComponent ]
})
class AppModule { }
const { platformBrowserDynamic } = ng.platformBrowserDynamic;
platformBrowserDynamic().bootstrapModule(AppModule);