Angular：使用 ng-repeat 和 ng-attr-id 动态设置 Id答案

【问题标题】：Angular: Dynamically Setting the Id with ng-repeat and ng-attr-idAngular：使用 ng-repeat 和 ng-attr-id 动态设置 Id
【发布时间】：2018-12-15 03:04:23
【问题描述】：

我正在尝试使用我的 ng-repeat 中使用的值设置锚标记的 id。 {{channel}} 应该包含一个带有频道号的字符串。 {{channel}} 作为锚标签中的文本显示得很好，但是对于 id，id 是空的，有人知道我该如何正确实现吗？

<li ng-repeat="channel in vm.channels">
    <a ui-sref="channel({channel:channel, event: null})" ng-attr-id="{{channel}}" ui-sref-active="active">{{managedContent 'channel'}} \{{channel}}</a>
</li>

【问题讨论】：

如果我将其更改为 ng-attr-id="channel"，那么 id 实际上只是设置为单词“channel”而不是存储在名为 channel 的变量中的字符串。跨度>
对不起，我的第一条评论是错误的，你需要括号。但是您的 id 将设置为 channel 的值，但 ng-attr-id 将像 ng-attr-id="{{channel}}" 上面的 html 中一样。这是我在我的网站上得到的。
1
id 应该设置为 1
问题是我的 ng-attr-id="{{channel}}" 将 id 留空，它没有按预期设置为“channel”中的值。
你的“通道”是什么我刚刚也尝试了对象并在 id
1
您在频道中有哪些数据。可能这就是问题所在。
Channel 只是一个字符串，例如“53”，正如您在上面的 html 中看到的那样，它在 vm.channels 中的每个通道中重复，vm.channels 是一个字符串数组。

标签： javascript html arrays angularjs angularjs-ng-repeat

【解决方案1】：

    <div class="accordion" [attr.id]="'accordionTwo_' + i" *ngFor=" let i = index; let message of messages">

    <button class="btn btn-info pull-right" data-toggle="collapse" [attr.data-parent]="'#accordionTwo_' + i" [attr.href]="'#collapseTwo_' + i"> Details </button>
    <div [attr.id]="'collapseTwo_' + i" class="panel-collapse collapse in">
    <h1>Expanded body</h1>
    </div>
    </div>

试试上面的 *ngFor 手风琴代码。

【讨论】：

【解决方案2】：

试试：

ng-attr-id="{{ '' + channel }}"

或者简单地说：

id="{{ channel }}"

【讨论】：