angularjs - Angular: ng-repeat ループで XHR リクエストを介して画像をロードする方法

Question

すべての人が写真を持てる連絡帳を作ろうとしています。写真を取得する前に連絡先を表示したいので、次のように記述します

<ul>
    <li ng-repeat="person in persons">{{person.firstname}} {{persone.lastname}}</li>
</ul>

私のスコープで利用可能な get_photo(person) を呼び出そうとします。

<ul>
    <li ng-repeat="person in persons">{{person.firstname}} {{persone.lastname}}
    <img ng-src="{{get_photo(person)}}" />
    </li>
</ul>

関数を ng-src にバインドし、ng-repeat が呼び出されるたびに get_photo を呼び出すため、これは機能しません。

最後に、DOM 要素の初期化時に get_photo を呼び出し、その結果を特定の属性の写真に格納しようとしました

<ul>
    <li ng-repeat="person in persons">{{person.firstname}} {{persone.lastname}}
    <img ng-init="get_photo(person)" ng-src="{{person.photo}}" />
    </li>
</ul>

$scope.get_photo = function (person) {
    // Simple example; I will try to get an image through xhr request later...
    person.photo = "http://img.blogduwebdesign.com/benjamin-sanchez/737/AngularJS.jpg";
};

同じことを行うためのより簡単でクリーンな方法はありますか? jsFiddle も作成しました: http://jsfiddle.net/V4Mss/

フィードバックをお寄せいただきありがとうございます。

t00f