AngularJs打印双引号

Question

I am using AngularJs in my MVC application, I am kinda new to AngularJs. I am having a problem and couldnt find it out. AngularJs prints double quotation inside html. here is my sample code.

What am I doing wrong?

<div class="visible-md visible-lg col-md-3 text-right" ng-controller="WeatherController">
    <div class="weather">
        <i id="weather_icon" class="icon">
            {{condition_image}}
        </i>
        <h3>
            <span class="glyphicon glyphicon-map-marker"></span>
            <span id="cityName"></span>

            <span class="temp">
                <span>
                    {{weathers}}
                </span>
            </span>
        </h3>
        <span class="date" id="current_date">
        </span>
    </div>
</div>

and this is how I set the variable.

$http.get('/api/getweatherbycityname/' + $city).
            success(function (data, status, headers, config) {
                $scope.weathers = data.condition_temp + '℃ ';
                $scope.condition_image = '<img src=\'~/Images/Weather/wi-yahoo-' + data.condition_code + '.png\' />';
                //document.getElementById("weather_icon").className += ' wi-yahoo-' + data.condition_code;
            }).
            error(function (data, status, headers, config) {
                //alert(data);
            })

Answer 1

You can do something like this

Use ng-src

In HTML:

    <img ng-src="{{condition_image}}" />

In Angularjs code:

 $scope.condition_image = '~/Images/Weather/wi-yahoo-' + test + '.png\';