鍍金池/ 問答/HTML5  HTML/ angularjs發(fā)送get請求出現(xiàn)錯誤

angularjs發(fā)送get請求出現(xiàn)錯誤

后端有個接口，請求/api/avatar/這個網(wǎng)址時，返回一個圖片的實際路徑/static/images/uploads/default，在瀏覽器中測試是完全OK的，如圖：

clipboard.png

但使用angular的get方法，代碼如下：

var myapp = angular.module("myapp", []);
myapp.controller("MainCtrl", ["$http", function ($http) {
    var self = this;
    this.get_avatar = function () {
        $http({
            method: "GET",
            url: "/api/avatar/"
        }).then(function (value) {
            console.log(value.data);
            return value.data;
        }, function (reason) {
            console.log(reason);
        })
    };
}]);

在html中使用<img ng-src="{{ctrl.get_avatar()}}">去獲取圖片地址，此時一打開html，前端瘋狂向后端發(fā)送get請求，如圖：

clipboard.png

瀏覽器console中也不斷地重復(fù)刷出錯誤，如圖：

clipboard.png

回答
編輯回答
不二心

沒寫過ng， 你看一下這么處理對嗎 ？
你寫的那個是返回一個promise 而不是函數(shù)結(jié)果
var myapp = angular.module("myapp", []);
myapp.controller("imgControl", ["$http", function ($http) {

var self = this;
    $http({
        method: "GET",
        url: "/api/avatar/"
    }).then(function (value) {
    this.src = value.data
    }, function (reason) {
        console.log(reason);
    })

}]);
<div ng-controller="srcControl as src">
<img ng-src="{{src.src}}">
</div>

2017年4月14日 02:20