1

AngularJS を使用して画像を表示し、毎分自動的に更新しようとしています。

問題は、私が取得している画像が、URL に偽物を追加して毎回異なる URL にすることを許可しない API からのものであることです。だから、いいえ?_ts=12356678など...

私が持っている現在のコードは次のようなものです：

HTML テンプレート:

<div data-ng-controller="UpdateController" data-ng-init="image_reloader(timer=2000, url='http://lorempixel.com/400/200/sports/')">
  <img ng-src="{{ image_url }}"></img>
</div>

AngularJS Javascript:

var app = angular.module('app', []);
app.controller('UpdateController', function($scope, $timeout) {
  $scope.image_reloader = function(timer, url) {
    $scope.timer = timer || 10000;
    $scope.updater = function() {
      $scope.image_url = url + '?_ts=' + new Date().getTime();
      $timeout($scope.updater, $scope.timer);
    };
    $scope.updater();
  };
});

この種のトリックは、使用できない部分を除いて?_ts...scope.image_url部分を変更$scope.image_url = url;しても何もしません。画像を更新しようとしません。

AngularJS に強制的に更新させるにはどうすればよいですか? また、URLに変更$scope.image_urlする前にに設定しようとしました。''

AngularJS は単なるフレームワークであり、どの Javascript/jQuery ソリューションでも可能ですが、私は AngularJS 関連のものを好みます。

4

2 に答える 2

3

この API のベンダーにダミー パラメータを追加するリクエストを送信したので、これが可能になりましたが、1 か月が経過しましたが、応答がありません。

私もこれについて考えていて、最終的に解決策を見つけました。? の代わりに # 記号を使用するだけで簡単です。ハッシュはサーバーに送信されることはありませんが、JavaScript がそれを別の要求として認識し、画像を再取得するには十分です..今までそれについて考えていなかったのは少し恥ずかしいです :)

例（AngularJS最適ではなく、このプロジェクトで行っているワークフローを使用

角度コード:

$scope.image_reloader = function(timer, url) {
  $scope.timer = timer || 10000;
  $scope.updater = function() {
    $scope.image_url = url + '#' + new Date().getTime();
    $timeout($scope.updater, $scope.timer);
  };
  $scope.updater();
};

HTML コード:

<div ng-controller="UpdateController" ng-init="image_reloader(timer=2000, url='http://lorempixel.com/400/200/sports/')">
  <img ng-src="[[ image_url ]]"></img>
</div>
于 2013-07-26T01:27:56.383 に答える
-1

このようなものが動作するはずです...これはテストされておらず、questionMarkIndex に 1 を加算または減算する必要がある場合があることに注意してください。

var questionMarkIndex = $scope.image_url.indexOf("?");
var newurl = (questionMarkIndex  === -1 ? $scope.image_url : $scope.image_url.substring(0, questionMarkIndex); // remove old ts parameter
newurl += '?_ts=' + new Date().getTime();
$scope.image_url += newurl;
于 2013-06-29T21:41:03.673 に答える