无法绑定到'lazyLoad',因为它不是ionic3中'img'标签的已知属性?

问题描述 投票:1回答:1

在对图像应用延迟加载后,在ionic3中重新加载页面后出现上述错误? enter image description here

我采取的步骤:

运行Npm:npm install ng2-lazyload-image --save`

导入我的组件:从'ng2-lazyload-image'导入{LazyLoadImageDirective};

在我的模板中:

在上面的模板中,userProduct.ImageCollection是从Fire-store获取的动态图像数组,但在加载页面后我遇到了上述错误。也许有一些我忽略的东西,但我似乎无法看到它是什么。

import { BrowserModule }                            from '@angular/platform-browser';
import { ErrorHandler, NgModule, enableProdMode }   from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { TranslateModule, TranslateLoader }         from '@ngx-translate/core';
import { LazyLoadImageModule }                      from 'ng2-lazyload-image';

@NgModule({
declarations: [
  MyApp,
  ImageSlider
],
imports: [
  BrowserModule,
  LazyLoadImageModule,
  IonicModule.forRoot(MyApp),
  IonicStorageModule.forRoot(),
  TranslateModule.forRoot({
    loader     : {
      provide    : TranslateLoader,
      useFactory : (createTranslateLoader),
      deps       : [HttpClient]
    }
  })
],
bootstrap: [IonicApp],
entryComponents: [
  MyApp,
  ImageSlider,
],
providers: [
  StatusBar,
  SplashScreen,
  Clipboard,
  {provide: ErrorHandler , useClass: IonicErrorHandler},
  Network
]
})
export class AppModule {}
enableProdMode();

export function createTranslateLoader(http: HttpClient) {
	return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}
	<img [defaultImage]="assets/imgs/product_defaultImg.png" [lazyLoad]="userProduct.ImageCollection[0].url" [offset]="offset">
ionic2 ionic3
1个回答
-1
投票

你走错了路。

import LazyLoadImageDirective到你的组件是错误的。

运行npm install ng2-lazyload-image --save后,请按照以下步骤操作。

在你的app.module.ts

import { LazyLoadImageModule } from 'ng2-lazyload-image';

@NgModule({
    imports: [ LazyLoadImageModule ]
})
export class AppModule {}

然后,您可以在HTML中使用它,如下所示。

<img [defaultImage]="defaultImage" [lazyLoad]="image" [offset]="offset">
© www.soinside.com 2019 - 2024. All rights reserved.