当前位置: 首页 > 知识库问答 >
问题:

*NGFOR在angular 2中不工作

冀永寿
2023-03-14

app.module.ts

import { NgModule }       from '@angular/core';
import { BrowserModule }  from '@angular/platform-browser';
import { FormsModule }    from '@angular/forms';
import { AppComponent }         from './app.component';
import { routing }  from './app.routing';
import { HttpModule, JsonpModule } from '@angular/http';
import { LoginComponent }       from './auth/login.component';
import { SignupComponent }       from './register/signup.component';

import { HomeComponent }    from './home/home.component';
import { SpinnerComponent} from './uiComponents/page-spinner/Spinner-Component';
import { SpinnerService} from './uiComponents/page-spinner/spinner-service';
import { authProviders }  from './auth/auth.providers';
import { LocalStorageService} from './state/local-storage.service';
import {CommonModule} from '@angular/common'

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,JsonpModule,CommonModule,
    routing
   // CrisisModule
  ],
  declarations: [
      AppComponent,
      LoginComponent,
      HomeComponent,
      SpinnerComponent,
      SignupComponent

  ],
  providers: [
      authProviders,
      SpinnerService,
      LocalStorageService
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule {


}

loads.module.ts

import {NgModule} from '@angular/core';

    import {LoadsRoutingModule} from './loads.routing';
    import {LoadsService} from './services/loads.service';

    import {
        LoadtypelistComponent,
        LoadsComponent,
        AnimalsComponent,
        BoatComponent,
        BulkComponent,
        CarComponent,
        ContainerComponent,
        EquipmentComponent,
        FurnitureComponent,
        MovingHouseComponent,
        OthersComponent,
        PalletizedComponent,
        ParcelsComponent,
        LoadsShared1Component,
        LoadsShared2Component
    } from './components/index';

    @NgModule({
        imports: [
            LoadsRoutingModule
        ],
        declarations: [
            LoadtypelistComponent,
            LoadsComponent,
            AnimalsComponent,
            BoatComponent,
            BulkComponent,
            CarComponent,
            ContainerComponent,
            EquipmentComponent,
            FurnitureComponent,
            MovingHouseComponent,
            OthersComponent,
            PalletizedComponent,
            ParcelsComponent,
            LoadsShared1Component,
            LoadsShared2Component
        ],
        providers: [LoadsService]
    })
    export class LoadsModule {

     }
import {Component, AfterViewInit,OnInit} from '@angular/core';
import {LoadsService} from '../services/loads.service';
import {VehicleClass} from '../models/file1'

@Component({
    selector: 'loads-parcels',
    templateUrl: 'Loads/_LoadParcels'
})
export class ParcelsComponent implements OnInit {
  classes;
  errorMessage:any;

  cc=['one','two','three']
  constructor(private loadsService: LoadsService) {}
    ngOnInit(){
     // this.loadsService.getVehicleclasses().then(classes => {this.classes = classes;},error =>  this.errorMessage = <any>error);        
    }


}
 <div *ngFor="let c of cc">{{c}}
 </div>

有什么需要帮忙的吗?

共有1个答案

史默
2023-03-14

您可能创建了另一个模块并声明了在那里使用的组件,但忘记了导入commonmodule,它提供了诸如*ngif*ngfor之类的通用指令。您不需要在appmodule中执行此操作,因为您导入了browsermodule,其中导出了commonmodule,因此这些指令可以在appmodule中使用。

 类似资料:
  • 我想检查实际元素是否有值。 例如,我想检查巧克力是黑色还是白色。根据这个,我想显示正确的文本。 如何修复代码,使其正常工作?

  • 大家好我想发送数据选择选项 Html TS optValue是只有名字的事件但我需要t 谢谢你!

  • 伙计们,你们能帮帮忙吗 所以我正在尝试显示我从后端获得的数据,但似乎 *ngFor 不起作用,只想返回启用的大小如何使用 ngIf 这是模板 这是我得到的数据(我正在循环的部分) 所以我需要显示每个尺寸的价格,然后减去折扣,如果未启用,则显示隐藏该尺寸。

  • 我使用的是angular2,我正在从一个服务绑定数据,问题是当我加载数据时,我应该用id过滤它,这就是我应该做的: 这是数据: 顺便说一下,我只想接受id=1的数据,但我看到了这个错误: 那么有什么建议将ngif和ngfor一起使用吗?

  • 我使用Angula-CLI创建了一个新项目,我遵循了https://www.npmjs.com/package/angular2-highcharts页面建议的所有步骤 npm install angular2-highcharts--保存从“angular2-highcharts”导入{ChartModule};ChartModule.forRoot(require('highCharts')

  • 我试图使用ngFor显示选项列表,但只满足某些条件,是否可以一起使用ngFor和ngIF来实现这一点?