时间戳

首页 > 解决方案 > 在属性绑定中访问 Map

angular - 在属性绑定中访问 Map

问题描述

我正在尝试从 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。第一个有效，第二个无效。

标签： angulartypescript

解决方案

下面试试。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);

推荐阅读