离子2:* ng不显示数据

时间:2017-06-22 00:12:05

标签: ionic2 ngfor

ngFor在HTML中不起作用。我在我的应用程序中只使用了一个模块。 我尝试了很多解决方案,但没有解决这个问题。 控制台中没有任何错误。 这是我的代码

movie.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import { Storage } from '@ionic/storage';



@Component({
  selector: 'page-movie',
  templateUrl: 'movie.html',
})
export class Movie {
  http: any;
  movies_cats: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage, http: Http) {
    this.http = http;
    return this.http.get('link.php?a=' + this.navParams.data.code + '&m=' + this.navParams.data.mac + '&s=' + this.navParams.data.serial + '&k=' + this.navParams.data.key + '&p=vodMovieList')
      .map(res => res.json())
      .subscribe(response => {
        this.movies_cats = response.vod_categories.vod_category;
        console.log(this.movies_cats);
      });
  }
}

movie.html

<ion-header>
  <ion-navbar>
    <ion-title>movie</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <ion-grid class="grid_div">
    <ion-row class="grid_row">
      <ion-col col-3 class="grid_col">
        <ion-scroll scrollY class="scroll_bar">
          <div class="scroll-item" *ngFor="let cat of movies_cats">
            <p>name</p>
          </div>
        </ion-scroll>
      </ion-col>
      <ion-col col-9>SUB CATEGORIES</ion-col>
    </ion-row>
  </ion-grid>
</ion-content>

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import {IonicStorageModule} from '@ionic/storage';

import { HttpModule} from '@angular/http';


import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { Categories } from '../pages/categories/categories';
import { Live } from '../pages/live/live';
import { Movie } from '../pages/movie/movie';


@NgModule({
  declarations: [
    MyApp,
    HomePage,
    Categories,Movie,Live
  ],
  imports: [
    BrowserModule,HttpModule,
    IonicModule.forRoot(MyApp),IonicStorageModule.forRoot(),
  IonicStorageModule.forRoot({
      name: '__mydb',
         driverOrder: ['indexeddb', 'sqlite', 'websql']
    })
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    Categories,Movie,Live
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},Storage
  ]
})
export class AppModule {}

Numeric Types

最后我希望div重复3次,例如响应中没有打印cat的对象数。 问题是HTML中没有任何内容出现

1 个答案:

答案 0 :(得分:0)

import { FormsModule} from '@angular/forms';
import { CommonModule } from '@angular/common';



imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    CommonModule
  ],