Angular Resize <img />

Question

Ich bin auf einer Webseite arbeiten (html, css, js [AngularJS])

Ich habe Bilder angezeigt werden, die unterschiedliche ursprüngliche Breite und Höhe hat, einen nach dem anderen, in den gleichen Element. Also wollte ich einen Tag mit dynamischer Quelle erstellen und Dimensionen

Ich möchte, dies tun:

[HTML] : <img id="previewImage" ng-show="main.selectedFileSource != ''" 
      style="width:{{main.selectedFileWidth}}; 
      height:{{main.selectedFileHeight}}; 
      position: absolute; top: 0; bottom:0; left: 0; right:0; margin: auto" 
      src="{{main.selectedFileSource}}" /> 

Die Quelle Änderungen funktionieren, aber das Problem kommt mit Breite und Höhe

Ich habe Eingänge um die Größe von selectedFileWidth/Height zu ändern, aber wenn ich sie ändere, ändern sich meine Dimensionen nicht ...

Ich habe versucht, eine Funktion zu verwenden, die Änderungen anwenden konnte ($ scope. $ apply()), aber es hat nicht gelöst es.

Ich versuchte ng-style = "{...}" statt Stil

ich auch schon versucht, diese zu nutzen:

var img = document.getElementById('previewImage') 
img.style.height = XXX 
img.style.width = YYY 

noch nicht funktioniert ... Es sieht aus wie Dimensionen gesperrt sind da ist schon erstellt. Soll ich das vorherige Tag löschen und jedes Mal ein neues erstellen, wenn ich das Bild ändere, das ich anzeigen möchte?

Irgendeine Idee? Danke fürs Lesen

Answer 1

angular.element("#previewImage").height("100px").width("100px); 

Geben Sie das ein gehen. angular.element aktualisiert automatisch die Ansicht und so weiter.

angular.element(selector) ist im Grunde das gleiche wie jQuerys $(selector).