How to use data binding to change part of class name string to any ISO country code?

问题: I want to display the country flag icon of an element using the flag-icon stylesheet. This displays a country flag based on a country's ISO code, for example: <span c...

问题:

I want to display the country flag icon of an element using the flag-icon stylesheet. This displays a country flag based on a country's ISO code, for example:

<span class="flag-icon flag-icon-gr"></span>

Displays the Greek flag (ISO code GR).

How do I dynamically change the two-character ISO code? Something like this:

<span class="flag-icon flag-icon-{{un_country}}"></span>

Or this:

<span [className]="'flag-icon flag-icon-{{un_country}}'"></span>

回答1:

it seems class="flag-icon" [ngClass]="'flag-icon-' + un_country" should work


回答2:

in comp.html

class="flag-icon" [ngClass]="flagClass"

in comp.ts

this.flagClass='flag-icon-' + this.un_country;

  • 发表于 2019-03-26 04:49
  • 阅读 ( 155 )
  • 分类:sof

条评论

请先 登录 后评论
不写代码的码农
小编

篇文章

作家榜 »

  1. 小编 文章
返回顶部
部分文章转自于网络,若有侵权请联系我们删除