如何引用动态创建的ngModel角

时间:2018-08-27 09:14:34

标签: angular

我处于*ngFor循环中,并通过给它一个动态名称使其成为NgModel,如何引用相同的NgModel组件读取其值?

这是我的代码

<tr *ngFor="let advise of selectedAdviseList | sortAdvises">
    <td>
        <div class="form-group">
            <label for="close_{{advise.ticker}}">
                50% <-"Show the real value of the number range slider"
            </label>
            <input 
                type="range" 
                class="form-control" 
                name="close_{{advise.ticker}}" 
                id="close_{{advise.ticker}}">
        </div>
    </td>
    <!-- ... more code -->
</tr>

1 个答案:

答案 0 :(得分:0)

您可以利用index轻松地动态引用您的输入。

请参考以下示例:-

<p *ngFor="let advise of [1,2,3,4,5]; let i = index">
    <td>
        <div class="form-group">
            <label for="close_{{advise.ticker}}">
                50% <-"Show the real value of the number range slider"
            </label>
            <input 
                type="range" 
                class="form-control" 
                name="close_{{advise.ticker}}" 
                id="close_{{advise.ticker}}"
                [(ngModel)]="ranges[i]">
        </div>
        <div>Value: {{ranges[i]}}</div>
    </td>
</p>

Please refer to the working Stackblitz