как автоматически перезагрузить снимок камеры

#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