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");

这是jsfiddle。第一个有效，第二个无效。

Answer 1

请尝试以下。 bgcolors.set()函数不能以防万一。另外，要访问地图中的项目，请使用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);

属性绑定中的访问映射

1 个答案: