ng：一个元素上不能有多个模板绑定。仅使用一个名为 template 或以 * 为前缀的属性

Question

我正在使用 angular5 ，我无法将 *dropdownMenu 与 *ngFor 一起使用，我收到此错误：

ng : Can't have multiple template bindings on one element . Use only one attribute named template or prefixed with *

这是代码：

<div class="btn-group" dropdown>
        <button dropdownToggle type="button" class="btn btn-primary dropdown-toggle" (click)="ListUsers()">
          List of users <span class="caret"></span>
        </button>
        <ul *dropdownMenu class="dropdown-menu" role="menu" *ngFor="let c of listUsers">
          <li role="menuitem"><a class="dropdown-item">{{c.Firstname}} {{c.lastName}}</a></li>
        </ul>
      </div>

我该如何解决这个问题？

Answer 1

Can't have multiple template bindings on one element手段*dropdownMenu和*ngIf指令不能一起出现在一个元素中，因为两者都是结构指令。

（*标记表明它们是结构指令）

编辑（解决方案）：

申请*ngFor于li，而不是于ul。

<div class="btn-group" dropdown>
        <button dropdownToggle type="button" class="btn btn-primary dropdown-toggle" (click)="ListUsers()">
          List of users <span class="caret"></span>
        </button>
        <ul *dropdownMenu class="dropdown-menu" role="menu" >
            <li role="menuitem" *ngFor="let c of listUsers">
                <a class="dropdown-item">
                 {{c.Firstname}} {{c.lastName}}
               </a>
            </li>
        </ul>
      </div>