ngFor не работает

Question

Я использую Angular 4.3.3 с JIT-компилятором и получаю сообщение об ошибке ниже при запуске приложения:

Property binding ngforOf not used by any directive on an embedded template. 
Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations".

Я удостоверился, что импортировал BrowserModule в свой основной модуль приложения, и я импортировал CommonModule в мой дочерний модуль, из которого происходит эта ошибка.

Вот шаблон, который выдает ошибку:

<div class="background"></div>
<div class="content normal-page">
    <ons-fab position="top right" ripple>+</ons-fab>
    <ons-list>
        <ons-list-item *ngFor="let item of items; let i = index">
            <div class="center">
                #{{i}} msg: {{item.msg}}
            </div>
        </ons-list-item>
    </ons-list>
</div>

Так как я импортирую нужные модули в правильные места, что может быть причиной этой ошибки?

angular angular2-directives

10

Graham 31 Авг 2017 в 17:40

Answer 1

Я выяснил проблему, у меня был веб-пакет, минимизирующий мои шаблоны. Как только я выключил сворачивание тогда, это работает отлично.

{
    test: /\.html$/,
    use: [
        {
            loader: 'html-loader',
            options: {
                minimize: false
            }
        }
    ]
}

4

Graham 31 Авг 2017 в 14:55

Answer 2

Модуль NgModule, содержащий ваш компонент, должен иметь CommonModule в imports

@NgModule({
  ...,
  imports: [CommonModule],
})
export class MySharedModule {}

Также binding ngforOf not used означает, что вы используете *ngfor вместо *ngFor с большой буквы F.

21

Günter Zöchbauer 31 Авг 2017 в 14:48

Answer 3

Иногда это может случиться, когда вы используете

* ngFor = "пустить данные в dataList"> {{data}}

Попробуйте изменить это на

* ngFor = "let data of dataList"> {{data}}

Вам нужно заменить «в» на «из».

3

soni kumari 8 Апр 2020 в 04:23

Answer 4

Иногда это может произойти, если вы забыли let в for:

<span *ngFor="teacher of teachers">{{teacher}}</span>

И это должно быть:

<span *ngFor="let teacher of teachers">{{teacher}}</span>

15

PhoneixS 16 Авг 2018 в 09:21

ngFor не работает

4 ответа

Похожие вопросы

Новые вопросы

angular