Image-Pfad in AngularJs

Wenn man sich die Fehler, die erzeugt wurde, enthält es einige url-kodierte Zeichen als gut. Ich betrat es in ein Url Decoder und das ist, was die Bild-url-Zeichenfolge tatsächlich aussieht.

http://localhost/demo/view/html/["http://farm6.staticflickr.com/5579/14671096893_806ec359b7_m.jpg"]

Beachten Sie die Klammer und Anführungszeichen?

Dies führt mich zu glauben, dass $scope.imageUrl enthält die [""] Symbole. Sie können ganz einfach testen diese durch Erbringung der Wert in einer <pre> tag neben der <img> tag wie so...

<img ng-src="{{imageUrl}}">
<pre>{{imageUrl}}</pre>

Wenn der Wert in der gerenderten <pre> tag hat die [""] Symbole, dann die Lösung ist, entfernen Sie diese Symbole aus der $scope.imageUrl Eigenschaft.

Können Sie diese entfernen Symbole aus imageUrl wie so...

$scope.imageUrl = $scope.imageUrl.replace(/[\[\"\]]/g, "");

Allerdings, wenn Sie mithilfe des $http-Dienst zum abrufen dieser Daten aus dem Flickr-API, sollten Sie mithilfe der transformResponse option, die ermöglicht Ihnen, zu manipulieren Daten (in Ihrem Fall, entfernen schlechte Zeichen aus dem imageUrl) von einer http-Anforderung an, bevor die Lösung der Versprechen.

InformationsquelleAutor jessegavin

html-

<div ng-app>
  <div ng-controller="test">
    <img ng-src="{{imageUrl}}">
    </div>
  </div>      
</div>

js-

function test($scope){

     $scope.imageUrl = 'https://angularjs.org/img/AngularJS-small.png';

  }

InformationsquelleAutor Prasad