ng-src funktioniert nicht für Bildquelle mit bedingten Operator

Question

Ich verwende Bedingungsoperator, um die Quelle eines Bildes festzulegen. Bild ist aus der Datenbank und es wird eine Base64-Zeichenfolge sein. Ich bekomme einen weiteren booleschen aus der Datenbank, ob der Benutzer sein Profilfoto eingestellt hat oder nicht. Wenn er ein Bild einstellt, stelle ich als Quelle sonst eine lokale Svg-Datei ein. unten ist mein Code-Snippet.

<img id="profilePic" ng-src="{{ photoSet ? 'data:image/jpeg;base64,userPhoto': 'Images/profile.svg' }}"/> 

aber beiden Fällen ist es nicht funktioniert. Wo mache ich falsch?

Answer 1

Sie müssen geschweifte Klammern verwenden, der Wert erreicht ng-src, um sicherzustellen.

Sie können eines der folgenden Elemente verwenden.

Userphoto sollte sowohl den base64-Wert in den Fällen enthalten

<img id="profilePic" ng-src="{{photoSet}} ? 'data:image/jpeg;base64,{{userPhoto}}': 'Images/profile.svg'"/> 

ODER

<img ng-if="photoSet" id="profilePic" ng-src="data:image/jpeg;base64,{{userPhoto}}"/> 
<img ng-if="!photoSet" id="profilePic" ng-src="Images/profile.svg"/> 

Answer 2

Sie müssen den Pfad in der folgenden Art und Weise und prüfen, ob die Bedingungen in ng-if hinzuzufügen.

<img ng-if="photoSet" ng-src="1stImagePathHere" /> 
<img ng-if="!photoSet" ng-src="2ndImagePathHere" />