Holen Sie sich Breite und Höhe des Bildes mit ng2-Datei-Upload

Steffi

Ich möchte die Breite und Höhe eines hochgeladenen Bildes mit ng2-file-upload und Angular 6 abrufen und überprüfen.

Mein Code ist bisher:

constructor() {
    this.uploader = this.initializeUploader("url");
}

public uploader;


private initializeUploader(url: string): FileUploader {
    const uploadOptions: FileUploaderOptions = {
        allowedMimeType: ['image/jpeg', 'image/png' ],

    }
    const uploader = new FileUploader(uploadOptions);

    uploader.onAfterAddingFile = item => {
        console.log(item);
        //Want to get width here
    }

    return uploader;
}

und der HTML-Code:

<input type="file" ng2FileSelect [uploader]="uploader" />

Ich habe nach Lösungen gesucht, aber nichts hat bei mir geholfen. Habe die Idee gefunden

Upload.imageDimensions(file).then()

hier . Aber ich verstehe nicht, wie / wo "Upload" importiert werden soll. Habe auch die Lösung zum Hinzufügen gefunden

ngf-min-height="1"

im input-Element, aber ich kann nicht finden, wo ich den Fehler "fangen" kann, wenn die Größe des Eingabebildes falsch ist.

Benutzer4676340

Wandeln Sie Ihre Datei in eine base64 um und erstellen Sie ein Image mit dieser Basis als Quelle. Während des loadHooks können Sie die Größe des Bildes abrufen. Hier ist ein Arbeitsschnipsel!

function change() {
  const input = document.querySelector('input');
  const file = input.files[0];
  
  getBase64(file).then(base64 => {
    const img = new Image();
    img.onload = () => console.log(img.width, img.height);
    img.src = base64;
  });
}

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
  });
}
<input type="file" onchange="change()">

Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.

Bei Verstößen wenden Sie sich bitte [email protected] Löschen.

bearbeiten am
0

Lass mich ein paar Worte sagen

0Kommentare
LoginNach der Teilnahme an der Überprüfung

Verwandte Artikel

Holen Sie sich Breite und Höhe von URI des Bildes

Holen Sie sich Breite und Höhe des Bildes per Mausklick

Holen Sie sich die Breite Höhe des Remote-Bildes von der URL

Ändern Sie die Breite des Bildes und passen Sie die Höhe automatisch mit Quick Action an

Holen Sie sich Breite und Höhe des Geräts in Flutter

Vorschau des Bildes mit Anzeigehöhe und -breite mit jQuery

Holen Sie sich Breite und Höhe einer Zeile in RecycleView - Android

Holen Sie sich Breite und Höhe von JPanel außerhalb der Klasse

Holen Sie sich die Höhe und Breite der äußersten Ebene in json

Holen Sie sich Breite und Höhe von `xcb_get_geometry_reply ()`

Jquery-Funktion: Holen Sie sich img Breite und Höhe, dann addClass funktioniert nicht

Holen Sie sich Bildhöhe und -breite von einer Datenquelle

Die Höhe und Breite des Bildes kann nicht mit Javascript geändert werden

Ermitteln Sie mit JavaScript die tatsächliche Breite und Höhe eines Bildes? (in Safari / Chrome)

Legen Sie die Breite und Höhe eines mit jQuery geladenen Bildes fest

Geben Sie die Höhe und Breite des gezoomten Bildes in Matplotlib nach plt.show() an

Holen Sie sich die Breite Höhe des Iframe-Inhalts

Holen Sie sich mit Jquery die Koordinaten des angeklickten Bildes

Breite und Höhe des GridView-Bildes

Höhe und Breite des angehängten Bildes ermitteln?

Überprüfen Sie die Breite und Höhe eines Bildes

Holen Sie sich die Höhe/Breite von tkinter Canvas

Holen Sie sich die Größe einer Datei mit Upload und POST-Anfrage

Überprüfen Sie die Höhe des Bildes mit Javascript für mehrere Datei-Uploads

Holen Sie sich Länge, Höhe und Postanschrift mit Straßenname, Hausnummer und Stadt

Holen Sie sich Breite und Höhe von JPEG ohne 0xFF 0xC0

So berechnen Sie den Skalierungsfaktor des Bildes basierend auf der maximalen Breite und Höhe verschiedener Größen

Ändern Sie die Größe des YUV-Byte-Array-Bildes auf eine bestimmte Breite und Höhe

Ändern Sie die Größe des Bildes beim Hochladen in PHP auf die gleiche Breite und Höhe

TOP Liste

  1. 1

    So legen Sie mit dem Interface Builder unterschiedliche führende Speicherplätze für unterschiedliche Geräte fest

  2. 2

    Wie konvertiere ich einen Vektor von Bytes (u8) in eine Zeichenfolge?

  3. 3

    Wie kann ich in SCSS mehrere Klassen zu einer einzigen kombinieren?

  4. 4

    Eclipse Oxygen - Projekte verschwinden

  5. 5

    Wie konvertiert man einen Datenrahmen im langen Format in eine Liste mit einem geeigneten Format?

  6. 6

    Wie kann ich den Kaskadenmodus global einstellen?

  7. 7

    Wie erstelle ich einen neuen übergeordneten Knoten außerhalb der .ref (/ path) in der Firebase-Echtzeitdatenbank mithilfe von Cloud-Funktionen (Typescript)?

  8. 8

    So erhalten Sie eine gleichmäßige Höhe für alle Eingabefelder

  9. 9

    Python: Spalten mit demselben Namen zusammenführen, wobei der Mindestwert beibehalten wird

  10. 10

    Speichern Sie ein MPAndroidChart-Diagramm in einem Bild, ohne es in einer Aktivität anzuzeigen

  11. 11

    Gruppieren Sie Datenrahmenspalten nach ihrem Datum (die Spaltentitel enthalten) und fassen Sie die Instanzen von Einsen und Nullen in R . zusammen

  12. 12

    ElasticSearch BulkShardRequest ist aufgrund von org.elasticsearch.common.util.concurrent.EsThreadPoolExecutor fehlgeschlagen

  13. 13

    Tic Tac Toe-Spiel im React-Reset-Button funktioniert nicht

  14. 14

    Tomcat - Leiten Sie den alten Kontextstamm zum neuen Kontextstamm um

  15. 15

    Wie wählt man Unterschiede mit drei Tabellen aus?

  16. 16

    Ärgerliches Problem mit yaml, das ich nicht lösen kann

  17. 17

    Wie kann ich meine Tabelle abfragen, um sie in mySQL nach 2 Feldern zu gruppieren?

  18. 18

    So berechnen Sie die Verfügbarkeit von Anwendungen (SLA)

  19. 19

    Fügen Sie eine weitere Schaltfläche zu gwt Suggest Box hinzu

  20. 20

    Modbus Python Schneider PM5300

  21. 21

    Wie kann eine gleichmäßige Lastverteilung in ElasticSearch mit Indizes mit unterschiedlicher Anzahl von Shards erreicht werden?

heißlabel

Archiv