Saya memiliki masalah yang sama dengan aplikasi saya sejak memperbarui ke rc4.

Saya menghadapi masalah serupa dengan RC 4, di RC 3 berfungsi dengan baik.

Masalah yang sama di pihak saya

coba gunakan hanya "img" alih-alih "ion-img". Bekerja untuk saya.

"ion-img" berhenti bekerja untuk saya di rc4, juga (bahkan tanpa gulir virtual). Bisakah mengganti dengan "img" menyebabkan beberapa masalah kinerja dalam daftar yang lebih panjang?

@sajTempler ya itu berfungsi tetapi kami kehilangan manfaat kinerja seperti pemuatan malas yang datang dengan ion-img

Anda masih dapat menggunakan ng2 lazy loader. Ada dua atau lebih. Saya menggunakan yang ini https://github.com/tjoskar/ng2-lazyload-image

orang-orang Ciao,
ion-img berfungsi dengan baik hanya jika tag ada di konten yang terlihat., setiap Daftar, segmen, dan seterusnya ....tidak berfungsi.
Perbaikan sementara saya:

1. buka node_modules/ ionic-angular/component/img/img.js

2. ubah fungsi ngAferContentInit dengan:

   Img.prototype.ngAfterContentInit = function () {
   var _ini = ini;
   this._img = this._elementRef.nativeElement.firstChild;

   if(!this._img.hasAttribute("src")){
   
   
       this._img.src=this._elementRef.nativeElement.getAttribute("src");
   
   }
   
   this._unreg = this._platform.addEventListener(this._img, 'load', function () {
       _this._hasLoaded = true;
       _this.update();
   }, { passive: true });
   

   };

Semoga cepat diperbaiki oleh tim Ionic :)

Halo semua! Terima kasih telah menggunakan Ionic! Bisakah seseorang memposting repo yang dapat saya gunakan untuk mereproduksi masalah ini?

@jgw96 Saya mengirimi Anda email sampel

Apakah Anda masih memiliki masalah? "ion-img" tidak berfungsi seperti yang diharapkan di aplikasi saya, tetapi saya tidak dapat menemukan penjelasan untuk saat ini

Sama disini. Apakah ini sudah diperbaiki?

@naveedahmed1 Bisakah Anda memposting sampel Anda di sini? Saya tidak yakin kita membicarakan masalah yang sama

Kami juga mengalami masalah ini dengan grid non-virtualScroll kami. Kami mereproduksi masalah dalam plunker . Tampaknya berfungsi dengan baik dalam daftar terbatas (non-virtualScroll). Setiap kali kami menambahkan ion-infinite-scroll ke daftar, ion-images menunjukkan masalah dengan pemuatan dan pembongkaran.

Jadi daftar 'normal' tampaknya berfungsi dengan baik. Daftar dengan virtualScroll atau infiniteScroll tampaknya memiliki masalah.

RC5 - masalah yang sama

Rupanya ion-img hanya boleh digunakan bersama dengan virtualScroll:
https://github.com/driftyco/ionic/commit/a5bbbd55cbd0e256614b6a1062aabbab4b1f21bd

Saya memiliki perilaku yang persis sama dengan @pavimus

Setelah buffer gulir virtual, gambar tidak muncul, kelas css "img-unloaded" (lihat tangkapan layar di bawah)

dengan ion 2 akhir. Tolong, bisakah Anda berkomunikasi tentang masalah ini?

Saya memiliki bug ini juga di ionic terbaru

Karena kami benar-benar membutuhkan ini untuk bekerja di kisi gambar yang dapat digulir (ion-grid, tanpa gulir virtual), kami telah mengganti sementara file <project_root>/node_modules/ionic-angular/components/img/img.js dalam proyek kami dengan Gist .

Setelah beberapa penggalian, tampak bahwa _top_ dan _bottom_ dari ion-img tidak relatif terhadap bagian atas mutlak wadahnya, menyebabkan gambar yang salah dimuat/dibongkar. Lihat baris 231 dan 242 dari Intisari untuk solusinya.

Kami juga mencoba memperluas ion-img, tetapi tidak banyak berhasil. Dan membangun versi kustom (sementara) dari file dist Ionic dan menggunakannya sebagai ketergantungan lokal juga tampaknya lebih rumit dari yang kami kira. Jadi sementara tim Ionic mengerjakan ini, kami akan menggunakan solusi ini.

@sajTempler Apakah mungkin memuat gambar hanya ketika gulir berhenti dengan plugin itu?

Bug ini dan beberapa lagi (gambar tidak responsif dan hanya 5x5 di chrome/android, gambar tidak dimuat pada awal pertama sebelum pengguliran apa pun..) merusak aplikasi produksi yang sangat bergantung pada menampilkan artikel dengan gambar yang dimuat lambat.
Bagus bahwa kami tidak mendapatkan dokumentasi apa pun tentang perubahan tersebut. Bukannya ini berita apa-apa.

@ventr1x Saya juga bertanya-tanya apa yang dilakukan pengembang karena bug kritis ini masih terbuka mulai 16 Desember

Itu benar-benar rusak (tidak pernah benar-benar berfungsi, dalam versi beta bahkan tidak disebutkan di dokumen mana pun).

Saya beralih ke ng2-lazyload-image dan membuatnya bekerja dengan rc6 seperti itu (jadi beberapa mungkin tidak melalui hal-hal yang tidak didokumentasikan yang sama ..):

Komponen

import { Component, ViewChild } from '@angular/core';
import { Content } from 'ionic-angular';

@Component({
  templateUrl: 'image-modal.html'
})
export class ImageModal {
  @ViewChild(Content) content: Content;

  constructor() {
  }

}

Melihat
<img [src]="img" [lazyLoad]="img" [scrollObservable]="content.ionScroll" />

@ventr1x Apakah mungkin memuat gambar hanya ketika pengguna berhenti menggulir dengan plugin ini?

@jgw96 ada pembaruan status?

Masalah yang sama disini..
Jika saya meletakkan ion-img di dalam segment itu tidak akan dimuat.
http://plnkr.co/edit/Zb2EQQVCFgdyZ1CRfPsW?p=preview

dapat dengan mudah mereproduksi dengan Ionic 3.1.1 di sini https://github.com/shprink/ionic-withwebworker-vs-withoutwebworker

Meskipun ini tidak terkait dengan masalah, @shprink apakah Anda menemukan cara untuk menjalankan aplikasi ionik lengkap dari webworker?

Belum mencoba yang seperti ini @naveedahmed1

Oke, tautan yang Anda bagikan memiliki url webworker, jadi saya pikir Anda mungkin telah mencobanya. Saya baru saja memeriksa Anda menggunakan pekerja layanan. Namun sayangnya pekerja layanan tidak didukung di perangkat sedangkan pekerja web bekerja di perangkat juga.

ion-img dalam gulungan virtual seharusnya memuat img dalam pekerja web itu sebabnya itu ada di judul.

Saya mengganti ion-img dengan img dan berfungsi dengan baik dalam gulir virtual gunakan img alih-alih ion-img

Doc mengatakan bahwa seseorang harus menggunakan ion-img untuk alasan kinerja, lihat: https://ionicframework.com/docs/api/components/virtual-scroll/VirtualScroll/

Oleh karena itu, memilih img alih-alih ion-img tidak dapat menjadi solusi permanen dan saya berharap bug lama ini akan segera diperbaiki.

@manucorporat Sudah ada kemajuan dalam masalah ini?

+1

Saya juga punya masalah ini. Bugnya adalah perhitungan img::top dan img::bottom di ion-img. Ini akan digunakan untuk menyetel flag canRequest dan canRender di Content::updateImgs untuk ion-img saat menggulir.
Solusi pertama saya adalah memperluas ion-img untuk daftar virtual.

import {Component, ElementRef, Renderer, Optional} from "@angular/core";
import {Img, Platform, DomController, Content} from "ionic-angular";

@Component({
  selector: 'virtual-ion-img',
  template: '<img>'
})
export class VirtualIonImg extends Img {
  constructor(private __elementRef: ElementRef,
              __renderer: Renderer,
              __plt: Platform,
              @Optional() private __content: Content,
              __dom: DomController) {
    super(__elementRef, __renderer, __plt, __content, __dom);
  }

  get top(){
    this._rect = (<HTMLElement>this.__elementRef.nativeElement).getBoundingClientRect();
    return this._rect.top + this.__content.scrollTop - this.__content._cTop;
  }
  get bottom(){
    this._rect = (<HTMLElement>this.__elementRef.nativeElement).getBoundingClientRect();
    return this._rect.bottom + this.__content.scrollTop - this.__content._cTop;
  }
}

Pilihan lainnya adalah memperbaiki perhitungan di Content::imgsUpdate dengan mengganti fungsi ini di halaman Anda.

import {updateImgs} from "ionic-angular/components/content/content";
import {Component, ViewChild} from "@angular/core";
import {Content} from "ionic-angular";

@Component({
  templateUrl: 'virtual-list.html',
})
export class VirtualListPage {
  @ViewChild(Content) _content: Content;
  ngAfterViewInit(){
    if(this._content) {
      this._content.imgsUpdate = () => {
        if (this._content._scroll.initialized && this._content._imgs.length && this._content.isImgsUpdatable()) {
          // reset cached bounds
          this._content._imgs.forEach((img:Img)=>img._rect = null);
          // use global position to calculate if an img is in the viewable area
          updateImgs(this._content._imgs, this._content._cTop * -1, this._content.contentHeight, this._content.directionY, 1400, 400);
        }
      };
    }
  }
}

DavidWiesner terima kasih atas jawabannya
saya baru dalam ionik dan sudut (menguji ionik vs bereaksi asli sebenarnya)

di file mana saya harus melewati ini? di app.components.ts ?

@DavidWiesner , Terima kasih atas solusinya. Bisakah Anda memberi kami contoh? Saya terjebak dengan fungsi updateImgs()

@alainib

untuk solusi pertama

Anda harus membuat file baru misalnya src/components/virtual-ion-img.ts komponen baru ini daripada harus mendaftar di src/app/app.module.ts

import {VirtualIonImg} from "../components/virtual-ion-img";
...
@NgModule({
    declarations: [
        //... all other pages and components,
        VirtualIonImg
    ],
//... all other stuff e.g.: imports, providers
    entryComponents: [
        //... other pages and components,
        VirtualIonImg
    ]
})

Daripada Anda dapat menggunakan tag <virtual-ion-img [src]="url"></virtual-ion-img> sebagai ganti <ion-img> seperti yang dijelaskan di http://ionicframework.com/docs/api/components/virtual-scroll/VirtualScroll/#images -within-virtual -menggulir

untuk solusi kedua

Cukup edit file halaman TypeScript yang memiliki gulir virtual di dalamnya dan tambahkan impor, item ViewChild dan metode ngAfterViewInit .

@ kabus202 Saya mengedit komentar saya dan menambahkan pernyataan impor yang hilang. Fungsi updateImgs didefinisikan dalam paket konten sudut ionik dan harus diimpor.

@DavidWiesner Solusi pertama berfungsi lebih baik, tetapi saya masih melihat gambar basi di tempat gambar yang tidak dimuat.

@DavidWiesner : Terima kasih banyak! Solusi pertama Anda tampaknya bekerja dengan sempurna untuk saya (dalam contoh yang sangat sederhana yang saya buat untuk meyakinkan diri sendiri bahwa saya tidak gila dan bahwa VirtualScroll memang rusak), saya akan mencobanya di aplikasi kehidupan nyata sekarang.

Bisakah Anda membuat permintaan tarik untuk memperbaiki komponen _Img_ Ionic yang sebenarnya?

@DavidWiesner terima kasih atas penjelasannya.
Saya masih mengalami masalah maaf (saya baru dan mencoba react/ionic/nativscript secara bersamaan)

Inilah yang saya lakukan :

app.module.ts

import { NgModule, ErrorHandler } from '@angular/core';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
import {VirtualIonImg} from "../components/virtual-ion-img";


@NgModule({
  declarations: [
    MyApp,      AboutPage,      ContactPage,        HomePage,       TabsPage
    VirtualIonImg
  ],
  imports: [
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,  AboutPage,      ContactPage,    HomePage,TabsPage
    VirtualIonImg
  ],
  providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}]
})
export class AppModule {}

virtual-ion-img.ts

import {Component, ElementRef, Renderer, Optional} from "@angular/core";
import {Img, Platform, DomController, Content} from "ionic-angular";

@Component({
  selector: 'virtual-ion-img',
  template: '<img>'
})
export class VirtualIonImg extends Img {
  constructor(private __elementRef: ElementRef,
              __renderer: Renderer,
              __plt: Platform,
              @Optional() private __content: Content,
              __dom: DomController) {
    super(__elementRef, __renderer, __plt, __content, __dom);
  }

  get top(){
    this._rect = (<HTMLElement>this.__elementRef.nativeElement).getBoundingClientRect();
    return this._rect.top + this.__content.scrollTop - this.__content._cTop;
  }
  get bottom(){
    this._rect = (<HTMLElement>this.__elementRef.nativeElement).getBoundingClientRect();
    return this._rect.bottom + this.__content.scrollTop - this.__content._cTop;
  }
}

pandangan ku

<ion-content padding>
  <h2>Ionic List items</h2>
    <ion-list [virtualScroll]="items">
        <ion-item *virtualItem="let item">
            {{ item.i }}
            <virtual-ion-img [src]="item.src"
                 alt="item.image"  height="200" width="300" >
            </virtual-ion-img>
        </ion-item>
    </ion-list>

  FIN
</ion-content>

saya memiliki kesalahan ini:

[WARN] Error occurred during command execution from a CLI plugin (@ionic/cli-plugin-cordova). Your plugins may be out of
       date.
Error: Template parse errors:
Can't bind to 'src' since it isn't a known property of 'virtual-ion-img'.
1. If 'virtual-ion-img' is an Angular component and it has 'src' input, then verify that it is part of this module.
2. If 'virtual-ion-img' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this componen
t to suppress this message.
 ("
        {{ item.i }}

        <virtual-ion-img [ERROR ->][src]="item.src"
             alt="item.image"  height="200" width="300" >
                </virtual-ion-img>
"): HomePage<strong i="19">@16</strong>:25

tolong apa yang saya lewatkan?

@alainib Mungkin Anda perlu menggunakan [src]="item.src" daripada src="item.src

kabus202 . terimakasih atas bantuannya. kesalahan yang saya dapatkan adalah dengan [src] , saya mencoba keduanya tetapi saya menempelkan kode html yang salah;)

dengan 'src' saya mendapatkan kesalahan ini

typescript: ..._amap/react-native-compare-ionic2-master/ionic/src/components/virtual-ion-img.ts, line: 14
Supplied parameters do not match any signature of call target.

            __dom: DomController) {
  super(__elementRef, __renderer, __plt, __content, __dom);

ngc failed: Failed to transpile TypeScript

@alainib versi ion apa yang Anda gunakan? Dalam 3.2 konstruktor Img diubah. Sebelum Ionic 3.2 Anda harus menambahkan NgZone sebagai parameter lain ke konstruktor.

VirtualIonImg sebelum Ionic 3.2

import {Component, ElementRef, Renderer, Optional, NgZone} from "@angular/core";
import {Img, Platform, DomController, Content} from "ionic-angular";

@Component({
  selector: 'virtual-ion-img',
  template: '<img>'
})
export class VirtualIonImg extends Img {
  constructor(private __elementRef: ElementRef,
              __renderer: Renderer,
              __plt: Platform, 
              __zone: NgZone,
              @Optional() private __content: Content,
              __dom: DomController) {
    super(__elementRef, __renderer, __plt, __zone, __content, __dom);
  }

  get top(){
    this._rect = (<HTMLElement>this.__elementRef.nativeElement).getBoundingClientRect();
    return this._rect.top + this.__content.scrollTop - this.__content._cTop;
  }
  get bottom(){
    this._rect = (<HTMLElement>this.__elementRef.nativeElement).getBoundingClientRect();
    return this._rect.bottom + this.__content.scrollTop - this.__content._cTop;
  }
}

Sudah enam bulan, mengapa tidak diperbaiki?

@WangRongda Apakah Anda mengirimkan PR yang seharusnya diterima yang memperbaiki ini?

@janpio Secara ajaib, ini ditampilkan secara normal sekarang. Saya mengalami masalah beberapa hari karena ion-img tidak dapat ditampilkan secara normal. Maaf.

Masih memiliki masalah, dalam daftar dengan ~200 item dengan gambar jarak jauh, gambar tidak dimuat atau diacak (gambar dari item sebelumnya ada di item saat ini). Adakah ide bagaimana cara memperbaikinya? Saya mencoba solusinya dengan virtual-ion-img dan tidak berhasil

@dspachos seperti yang saya pahami, tim ionik menyebutkan bahwa memperbaiki bug gulir virtual bukanlah prioritas bagi mereka saat ini, coba gunakan gulir tak terbatas sebagai gantinya.

@JustasKuizinas Tapi infinite-scroll bukanlah solusi. Pada akhirnya, semua item ada di DOM. Jadi ada banyak masalah memori terutama di iOS.

Ada masalah serupa di ionic1.x. Saya pikir semuanya sudah diperbaiki di ionic2 atau 3. Sayangnya tidak ada solusi.

@vahidvdn itu bukan solusi tetapi tim ionik sendiri mengatakan itu pilihan terbaik sekarang sampai gulir virtual diperbaiki :)

@JustasKuizinas Saya harap mereka memperbaiki masalah ini.

Tetapi ada perpustakaan bagus yang disebut vs-repeat (untuk angularjs dan angular). Saya menguji angularjs. Ini benar-benar luar biasa, tetapi memiliki banyak kelambatan saat menggulir di iOS.

Saya tidak tahu apa prioritas tim ionik, tetapi virtualScroll adalah salah satu komponen terpenting yang digunakan aplikasi dunia nyata.

@vahidvdn Sangat setuju dengan Anda, saya akan menyelesaikan aplikasi saya saat ini menggunakan Ionic, tetapi saya telah memutuskan bahwa untuk aplikasi saya berikutnya, saya akan menggunakan kerangka kerja lain (mungkin React Native atau skrip Native). Tim Ionic melakukan pekerjaan dengan baik, tetapi kerangka kerja mengalami masalah kinerja. Di aplikasi saya saat ini, saya berakhir dengan daftar statis maksimum 50 item dengan gambar (karena bug gulir virtual) dan ketika saya menekan tombol Kembali ada jeda (saya sederhana menggunakan popView, perilaku default). Kelambatan ini tidak ada misalnya ketika daftar saya memiliki 15-20 item.
Selain itu, di iOS ketika perangkat dalam mode hemat baterai (dan CPU mungkin memperlambat segalanya) kinerjanya bahkan lebih buruk, hampir tidak dapat digunakan.

@dspachos beberapa bulan yang lalu saya juga berpikir oh itu gulir virtual itu harus menjadi prioritas utama untuk membuatnya berfungsi seperti pesona jadi saya memilih ionik daripada skrip asli, tetapi sekarang sedih mendengarnya masih rusak dan kami tidak bisa mendapatkan kinerja bebas lag dengan daftar besar data.

Saya memiliki masalah yang sama, tetapi saya tahu bahwa daftar saya akan memiliki kurang dari 150 item. Saya mencoba menggunakan img alih-alih ion-img dan berfungsi dengan baik tanpa kehilangan kinerja. Saya kehilangan waktu mencoba menyelesaikan dengan ion-img tetapi sebenarnya tidak semua daftar membutuhkan sumber daya ini.

@diegomachado1 Apakah Anda yakin gambar Anda berada di posisi yang benar? Harap perlambat koneksi jaringan Anda, lalu uji lagi. Ketika beberapa gambar tidak dimuat, gambar sebelumnya muncul di tempatnya dan saling bertentangan.

2016-08-16 dan ionic 3.6 dan masalah masih ada.
Dalam kasus saya, saya menerapkan perbaikan kedua (diposting di atas) dan berhasil.

@decpio Tolong beri tahu kami apa yang sebenarnya Anda lakukan?

Oke,

Saya menambahkan ke halaman rusak saya:
import { Komponen, ViewChild } dari '@angular/core';
impor { updateImgs } dari 'ionic-angular/components/content/content';
impor { Img } dari 'ionic-angular/components/img/img-interface';
import { Content } dari 'ionic-angular';

/* 2017-08-16 - add this to class body
    start FIX#9660 ion-img doesn't correctly work with virtualScroll
    https://github.com/ionic-team/ionic/issues/9660#issuecomment-304840427
*/
@ViewChild(Content) _content: Content;
ngAfterViewInit() {
    if (this._content) {
        this._content.imgsUpdate = () => {
            if (this._content._scroll.initialized && this._content._imgs.length && this._content.isImgsUpdatable()) {
                // reset cached bounds
                this._content._imgs.forEach((img: Img) => (<any>img)._rect = null);
                // use global position to calculate if an img is in the viewable area
                updateImgs(this._content._imgs, this._content._cTop * -1, this._content.contentHeight, this._content.directionY, 1400, 400);
            }
        };
    }
}
/*
end FIX#9660
*/

dan hanya itu - masalah hilang.
Halaman saya yang rusak:

<ion-content padding> <ion-grid [virtualScroll]="__items" [bufferRatio]="2" approxItemHeight="80px" approxItemWidth="100%" [virtualTrackBy]="ItemComparer"> <div *virtualItem="let item"> <ion-row align-items-center justify-content-center> <ion-col col-auto> <ion-item> <ion-thumbnail item-start> <ion-img [src]="'my-personalized-url?item='+item?.item"></ion-img> </ion-thumbnail> </ion-item> </ion-col> </ion-row> </ion-grid>

@DavidWiesner Terima kasih! Saya menggunakan Ionic-Angular 3.6.0 (terbaru pada saat penulisan ini), dan berfungsi seperti yang diharapkan.

Yang ke-2 bekerja dengan sangat baik juga. Tetapi saya tidak ingin menggunakannya karena masalah lebar dan tinggi. Saya juga mengalami beberapa masalah di mana item bawah tumpang tindih dengan item di atasnya jika gambarnya belum dimuat. Tetapi ketika saya menggulir ke bawah, masalah yang tumpang tindih hilang. Item sebelumnya yang telah menghilang dari viewport mulai tumpang tindih. Dan begitu item tersebut berada di viewport dan gambar dimuat lagi, masalah tumpang tindih hilang untuk kumpulan tersebut. Hanya FYI.

@decpio solusi Anda bekerja sempurna untuk saya. Gambar tetap "dibongkar" selama gulir tidak mencapainya tetapi dimuat dan muncul saat seharusnya. Terima kasih banyak!!!

Hanya satu hal yang diperhatikan, jika ukuran layar/jendela/bingkai berubah setelah halaman dimuat, pemuatan berenda masih berfungsi hanya untuk sejumlah item yang berada dalam kisaran init. Tapi ini bisa disebabkan oleh perilaku asal sudah.

terima kasih @DavidWiesner & @decpio solusi kedua memperbaiki masalah pada Ionic 3.7.1

Jadi solusinya memperbaiki masalah untuk Ionic 3.8 juga. Mengapa tidak menggunakannya @manucorporat @adamdbradley
Ini masih sesuatu yang sangat buruk untuk penggunaan VS apa pun ...
@masimplo Maukah Anda memeriksanya? Setelah pekerjaan luar biasa Anda untuk https://github.com/ionic-team/ionic/pull/12917 Anda pasti memiliki keterampilan untuk menyelam di VS...

solusi ini tidak berfungsi di iOS9. Di iOS10 & iOS11 tidak apa-apa.

@HugoHeneault , @manucorporat , @adamdbradley : Saya sepenuhnya setuju bahwa solusi ini harus digabungkan dalam Ionic (saya akan melakukan permintaan tarik tetapi karena saya bukan penulis solusi, saya tidak merasa nyaman membuatnya sendiri), mungkin tidak sempurna, tapi masih jauh lebih baik daripada tanpa patch.

Saya pikir masalahnya adalah tim Ionic tidak menyadari bahwa virtualscroll tidak berfungsi. Ada entri yang mengatakan "gulir virtual: perbaikan masalah yang berkedip" di log perubahan 3.8, mengapa Anda pergi dan memperbaiki beberapa masalah yang berkedip untuk fitur yang Anda tahu tidak berfungsi sama sekali?

Saya setuju @nicolus , tim Ionic tidak menyadari bahwa virtualscroll/ion-img tidak berfungsi dan virtualscroll tidak berfungsi dengan ion-refresh. @HugoHeneault @manucorporat @adamdbradley

@HugoHeneault Saya belum benar-benar bekerja dengan ion-img sama sekali. Saya mungkin harus, tapi tidak. Saya dapat melihat tetapi saya tidak memiliki referensi tentang apa yang rusak.

@nicolus entri di changelog berasal dari PR yang saya kirimkan sendiri yang memperbaiki masalah regresi dalam gulir virtual. Saya memahami frustrasi Anda, tetapi PR memperbaiki masalah tertentu dengan VS yang membuatnya tidak dapat digunakan ketika kumpulan data yang mendasarinya sering diperbarui, itu bukan penulisan ulang lengkap komponen yang menyelesaikan semua masalah.

Saya juga setuju bahwa VS membutuhkan lebih banyak perhatian tetapi memiliki dua masalah utama yang mungkin membuat pemeliharaannya tidak dapat dilakukan:

1. Gulir virtual adalah masalah yang sulit dipecahkan sejak awal. Sangat sedikit kerangka kerja/pustaka yang berhasil menyelesaikannya dan dengan batasan tertentu. Ionic VS mencoba menyelesaikan semuanya, ukuran item variabel, multi kolom, header/footer per item, gambar, pengubahan ukuran dll. Implementasi yang ada telah melalui berbagai siklus refactoring memperbaiki bug di sana-sini banyak yang tidak terkait dengan komponen itu sendiri (lihat pada poin 2 untuk info lebih lanjut)
2. Gulir virtual ionik berinteraksi dengan banyak komponen ionik. Ion-img untuk gambar, gulir tak terbatas untuk memuat lebih banyak data, konten untuk menggulir, dll. Itu juga seharusnya membuat elemen ion ion-item, kartu ion dll serta elemen sudut khusus.

Kompleksitas ini terlalu banyak untuk ditangani oleh PR dan memerlukan desain ulang lengkap tentang apa yang dilakukan scroll virtual (yang berarti harus selaras dengan tujuan tim ionik), bagaimana ia melakukannya, dan interaksi apa dengan komponen lain yang seharusnya dimiliki.

Pindah ke ionic v4 Saya pikir banyak dari ini akan berubah (untuk satu itu mungkin hanya dapat membuat komponen web lain dan bukan komponen sudut di dalamnya) seperti yang dilakukan daftar besi polimer hari ini jadi tidak yakin apakah berupaya memperbaiki implementasi saat ini memiliki nilai nyata bagi orang-orang yang akan terus menggunakan kerangka kerja ionik setelah rilis v4 dalam proyek mereka. Saya juga mencari opsi keluar dari lubang kelinci ini karena tanpa gulir virtual kami tidak dapat bersaing dengan aplikasi asli dalam merender jumlah data yang realistis.

@masimplo : Anda benar, saya lupa bahwa gulir virtual digunakan lebih dari sekadar ion-img (karena untuk itulah saya pribadi menggunakannya).
Saya tidak bermaksud mengkritik perbaikan bug khusus ini, saya hanya berharap kami memiliki lebih banyak umpan balik dari tim mengenai masalah ini.

Saya berharap untuk perbaikan cepat yang satu ini. Apakah ada kabar baru? Apakah ini diselidiki oleh tim?

Saya berharap dalam perbaikan juga

@RafaelKr @fdambrosio Saya pikir lebih baik tidak mengharapkan perbaikan pada komponen sebelum v4 dirilis. Sayangnya bagi kami yang bekerja dengan ionic3, kami harus menangani komponen buggy atau memperbaikinya sendiri. Jangan ragu untuk memperbaiki & membuat PR ;)

+1

coba pakai cara ini
html <ion-img [src]="image.url" [alt]="image.alt">

masih menunggu perbaikan...

Anda harus menunggu ionic v4.

@miqmago : Silakan baca di sini untuk informasi lebih lanjut:
https://blog.ionicframework.com/whats-the-issue-with-issues/

https://github.com/ionic-team/ionic/issues/9660#issuecomment -307314053 berhasil

Saya memiliki masalah yang sama dalam menampilkan gambar didi dalam [virtualScroll] bagaimana cara memperbaikinya.

Anda harus menunggu ionic v4.

Akan bodoh untuk percaya bahwa itu akan diperbaiki di Ionic 4.
Kami akan memiliki bug baru, tetapi tim akan fokus pada Ionic 5, lalu 6, meninggalkan banyak bug untuk setiap versi baru.
Di sisi React, ada risiko merusak perubahan di setiap versi, tetapi setidaknya kita tahu apa yang diharapkan.
Sangat kecewa dengan Ionic... Tidak layak membiarkan bug berlarut-larut begitu lama dan membiarkan pengguna memperbaikinya.

@ mopi1402 Saya tahu bahwa bagaimana masalah telah ditangani oleh tim ionik di masa lalu tidak terlalu bagus. Tetapi jika Anda ingin mempelajari bagaimana mereka akan menangani versi dan masalah yang akan datang, Anda harus membaca
https://blog.ionicframework.com/whats-the-issue-with-issues/
https://blog.ionicframework.com/ionic-semantic-versioning-release-schedule-and-lts/

Jangan lupa bahwa kerangka kerja ionik bersumber terbuka dan siapa pun dapat membantu memperbaiki masalah. :)

@ mopi1402 Jika Anda seorang pengembang Angular, saya sarankan Nativescript daripada reaksi-asli.
Di sini Anda dapat menemukan mengapa Nativescript lebih baik daripada bereaksi.

Saya setuju @mopi1402 ini adalah salah satu fitur yang paling banyak digunakan

Masih tidak berfungsi di v4 beta.

tidak baik tidak bekerja dengan Ionic 4

Ionic adalah perangkat lunak open source guys, jika Anda ingin semuanya diperbaiki dengan cepat, Anda dapat membuat tambalan dan mengirimkan PR 👍

@HugoHeneault : Ini adalah perangkat lunak sumber terbuka yang saya bayar $29 per bulan melalui langganan pro saya (maksud saya, kerangka kerja itu sendiri gratis, tetapi mereka bukan organisasi nirlaba, mereka memberikan kerangka kerja secara gratis untuk membuat uang untuk langganan), jadi saya tidak berharap harus memperbaikinya sendiri secara gratis.

Saya dapat memahami bahwa ini adalah masalah yang sulit untuk diperbaiki, bahwa ionic 4 masih beta, bahwa ini adalah masalah dengan prioritas rendah... Semua itu adalah alasan yang benar-benar valid, tetapi "OSS memperbaikinya sendiri lol" tidak.

@nicolus Anda benar, dan saya juga mengeluh ketika layanan yang saya bayar tidak berfungsi. Tetapi kita harus ingat bahwa meskipun perusahaan Ionic mungkin menghasilkan uang dari layanan premium, banyak pengembang dari tim mereka bekerja keras dan perlu mencari nafkah... untuk alat gratis yang dapat digunakan siapa saja tanpa membayar.

Bagi saya inilah cara kerja OSS: Anda tidak memiliki kewajiban untuk membayar layanan mereka dan dapat membuat aplikasi yang luar biasa tanpa memberikan satu sen pun, tetapi mereka menyediakan layanan untuk membuat hidup Anda lebih mudah. Saya juga membayar banyak langganan pro yang tidak berarti saya tidak dapat membantu ketika perbaikan dimungkinkan tanpa menghabiskan waktu berhari-hari untuk itu.

Masalah ini telah diidentifikasi secara otomatis sebagai masalah Ionic 3. Kami baru-baru ini memindahkan Ionic 3 ke repositorinya sendiri. Saya memindahkan masalah ini ke repositori untuk Ionic 3. Harap lacak masalah ini di sana.

Jika saya melakukan kesalahan, dan jika masalah ini masih relevan dengan Ionic 4, beri tahu tim Ionic Framework!

Terima kasih telah menggunakan Ionic!

Masalah dipindahkan ke: https://github.com/ionic-team/ionic-v3/issues/148