在Angular 8中动态创建单选按钮名称(Typescript，HTML，SCSS) [英] Dynamically Creating a Radio Button name in Angular 8(Typescript, HTML, SCSS)

问题描述

我在动态创建单选按钮名称时遇到了一些挑战.如何动态生成单选按钮名称.这是我的html代码

I am having some challenges creating a radio button name Dynamically. How can I Dynamically generate a radio button name. Here is my html code

<table>
    <td>
        <input type="radio" #radio [id]="inputId" name="radio" />
        <label [for]="inputId">
        <ng-content></ng-content>
        </label>
    </td>
    <br />
    <br />
</table>

我还像这样将字符串传递给Radio Buttton Component

I am also passing a string to the Radio Buttton Component like this

<radio-button>
    <b>Radio Button 1</b>
</radio-button>
<radio-button>
    <b>Radio Button 2</b>
</radio-button>
<radio-button>
    <b>Radio Button 3</b>
</radio-button>
<radio-button>
    <b>Radio Button 4</b>
</radio-button>

我的 name 属性被硬编码到类似于 name ="radio" 这样的组件.我想为单选按钮生成一个动态分配的名称

My name attribute is hard-coded to the component like name="radio". I want to generate a dynamically assigned names for the radio button

推荐答案

您可以在html中尝试for循环，并将单选按钮代码放入其中，并使单选按钮标记如下:

You can try a for loop inside your html and put radio button code inside that and have your radio button tag something like below:

<input type="radio" name="rbtn[{{i}}]" [attr.name]="i" [value]="" />

这篇关于在Angular 8中动态创建单选按钮名称(Typescript，HTML，SCSS)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！