我有一个用 *ngFor 创建的角度网格。我在行内放置了一个自动完成功能,但我在建模时遇到了麻烦

问题描述 投票:0回答:1

`我知道 [(ngModel)]="selected" 对于所有导致问题的行, 我需要一些解决方法来解决并将每行中的单个项目保留为选定的enter image description here。 目前,如果我选择一个,它会反映在所有行中,因为 [(ngModel)]="selected"请随时提出在此类网格/表格中填充自动完成功能的任何想法。

            <table
              class="table table-sm table-hover table-bordered table-light"
              style="width: 100%"
            >
                  <th>list</th>
                  <th class="th">
                    type
                    <span style="cursor: pointer"> </span>
                  </th>
                  <th (click)="sort('tmprtr')">temperatureC</th>
                  <th>temperatureF</th>
                  <th>Summary</th>
                </tr>
              </thead>
              <tbody>
                <ng-container *ngFor="let c of codes; let i = index">
                  <tr>
                    
                    <td>
                      <div class="typeHead">
                        <input
                          type="text"
                          list="countries"
                          [attr.list]="'countries' + i"
                          [attr.name]="'country' + i"
                          [name]="i.toString()"
                          [(ngModel)]="selected"  <!--here is the problem-->
                        />
                        <datalist [id]="'countries' + i">
                          <option
                            *ngFor="let cntrs of countrylist; let j = index"
                            [value]="c.name"
                            (click)="selectCountryName(c.name, j)"
                          ></option>
                        </datalist>
                      </div>
                    </td>
                    <td>{{ product.temperatureC }}</td>
                    <td>{{ product.temperatureF }}</td>
                    <td>{{ product.summary }}</td>
                  </tr></ng-container
                >
              </tbody>
            </table>
angular autocomplete grid
1个回答
0
投票

尝试向国家/地区模型添加“选定”布尔属性。

使用全局变量this.selected将应用于所有。

([ngModel])="i.Selected" 将适用于每个人

© www.soinside.com 2019 - 2024. All rights reserved.