#html #angular
#HTML #угловой
Вопрос:
У меня есть IP-камера, которая выдает мне jpg. http://192.168.178.28/tmpfs/auto.jpg?user=USERamp;pwd=PASSWORD
<img [(src)]="linkPicture" alt="profile photo" width="450px" height="450px">
ОК
теперь я бы перезагрузил изображение с меткой времени
linkPicture = "http://192.168.178.28/tmpfs/auto.jpg?user=USERamp;pwd=PASSWORD";
setInterval(function(){
this.timeStamp = (new Date()).getTime();
this.linkPicture = "http://192.168.178.28/tmpfs/auto.jpg?" this.timeStamp "amp;user=USERamp;pwd=PASSWORD" ;
console.log(this.linkPicture);
);}, 2000);
но это не работает. Где я должен поставить временную метку? в конце URL-адреса? или как у меня уже есть?
мой img выдает мне первую «linkPicture», но не перезагружается … консоль показывает мне каждые 2 секунды. новое изображение ссылки
Ответ №1:
Ваша переменная this.linkPicture является внутренней для вашей интервальной функции и существует только в этой области. Это означает, что вы на самом деле не обновляете свою переменную снаружи.
Если вы используете babel, вы можете установить для функции в вашем интервале значение стрелки function () => { ваш код здесь… } тогда это будет означать внешнюю область.
setInterval(() => {
this.timeStamp = (new Date()).getTime();
this.linkPicture = "http://192.168.178.28/tmpfs/auto.jpg?" this.timeStamp "amp;user=USERamp;pwd=PASSWORD" ;
console.log(this.linkPicture);
}, 2000);
Или вы можете привязать контекст к внешней среде:
setInterval(function(){
this.timeStamp = (new Date()).getTime();
this.linkPicture = "http://192.168.178.28/tmpfs/auto.jpg?" this.timeStamp "amp;user=USERamp;pwd=PASSWORD" ;
console.log(this.linkPicture);
}.bind(this), 2000);
И вы также можете просто оставить this перед своей переменной linkPicture и объявить переменную linkPicture выше как var linkPicture = «ваш URL», а затем вы можете установить ее внутри своего интервала так же, как linkPicture = «ваш новый URL»
И самое лучшее решение было бы внутри вашей функции просто: linkPicture = this.linkPicture