2016-05-29 18 views
5

Tại sao Angular 2 không cho phép tôi tạo tập hợp các chế độ xem con trong div-block bằng cách sử dụng * ngFor?Lỗi phân tích cú pháp mẫu góc khi sử dụng ngFor bên trong div

Các trường hợp:

import {Component, Input} from '@angular/core'; 
import {ChoiceComponent} from './choice.component'; 
import {Question} from './model/Question'; 

@Component({ 
    selector: 'question', 
    template: ` 
    <div class="panel"> 
    {{question.text}} 
    <choice *ngFor="let choice of question.choices" [choice]="choice"> 
    </div> 
    `, 
    directives: [ChoiceComponent] 
}) 
export class QuestionComponent { 

    @Input() 
    question: Question; // Input binding from category component ngFor 
} 

gây

EXCEPTION: Template parse errors: 
Unexpected closing tag "div" (" 
    <div class="panel"> 
    <choice *ngFor="let choice of question.choices" [choice]="choice"> 
    [ERROR ->]</div> 
    "): [email protected]:4 

Tuy nhiên sau hoạt động tốt, nhưng tôi muốn có câu hỏi và lựa chọn các nút bên trong một bảng điều khiển tương tự.

<div class="panel"> 
    {{question.text}} 
</div> 
<choice *ngFor="let choice of question.choices" [choice]="choice"> 

Trả lời

4

Parser hy vọng<choice> thẻ để được đóng đầu tiên cho đến khi <div>.

Hãy thử sau

<div class="panel"> 
    {{question.text}} 
    <choice *ngFor="let choice of question.choices" [choice]="choice"> 
    </choice> 
</div> 
2

Hãy thử này: -

<div class="panel" *ngFor="let choice of question?.choices"> 
{{question.text}} 
<choice [choice]="choice"> </choice> 
</div> 

Bằng cách đó bạn đang lặp lại div khối và đối với từng lặp lại có một văn bản và nút. nếu một cái gì đó chưa rõ ràng xin vui lòng yêu cầu tôi hoặc đăng plunker nếu có thể.

1

Tôi sẽ xem xét Đóng bằng </choice>

Các vấn đề liên quan