>

이 오류가 발생했습니다

와이즈 비즈

그러나이 문제를 해결하는 방법을 모르겠습니다. 수행하려는 것은 내 2D 배열을 표시하고 중첩 루프를 수행해야하기 때문입니다. 나는

Can't have multiple template bindings on one element (" list-group-item-success" [draggable] *ngFor="let item of [vegetables[0][0]]" which I know what it means.

할 것이다  항목을 표시하기 위해 외부 배열을 반복합니다. 따라서 모두 i 에 바인딩되어야합니다.  지령. 그러나 이것이 여러 개의 ngFor를 사용할 수없는 것입니다.

코드는 다음과 같습니다.

draggable

vegetables = [[ {name: 'Carrot', type: 'vegetable'}, {name: 'Onion', type: 'vegetable'}, {name: 'Potato', type: 'vegetable'}, {name: 'Capsicum', type: 'vegetable'}], [ {name: 'Carrotas', type: 'vegetable'}, {name: 'Onionas', type: 'vegetable'}, {name: 'Potatoas', type: 'vegetable'}, {name: 'Capsicumas', type: 'vegetable'}]] <div class="card-block scroll-list"> <div class="list-group"> <li class="list-group-item list-group-item-action list-group-item-success" [draggable] *ngFor="let item of [vegetables[0][0]]" *ngFor="let items of [item.values]" [dragClass]="'active'" [dragTransitClass]="'active'" [dragData]="item" [dragScope]="item.type" [dragEnabled]="dragEnabled"> {{items.name}} </li> </div> </div>

  • 답변 # 1

    리 내부에 ng-container를 사용하는 것이 좋습니다. 하나의 HTML 요소에 2 * ngFor를 사용할 수 없습니다.

    예 :

    <li class="list-group-item list-group-item-action list-group-item-success" [draggable] *ngFor="let item of [vegetables[0][0]]" [dragClass]="'active'" [dragTransitClass]="'active'" [dragData]="item" [dragScope]="item.type" [dragEnabled]="dragEnabled">
        <ng-container *ngFor="let items of [item.values]">
            {{items.name}}
        </ng-container>
    </li>
    
    

  • 답변 # 2

    두 개의 *ngFor 가 있습니다  같은 요소에. 별도의 div 에서 내부를 추출 .

    <li *ngFor="let item of [vegetables[0][0]]"...
      <div *ngFor="let items of [item.values]" ...
    
    

  • 이전 c++ - 오류 오류 - ‘void *’는 객체에 대한 포인터 유형이 아닙니다
  • 다음 python - pandas 0234에서 두 열을 조합하여 그룹화