Question

我有一个IP摄像头，可以给我一个jpg。 http://192.168.178.28/tmpfs/auto.jpg?user=USER&pwd=PASSWORD

yarn install

好

现在，我将使用时间戳重新加载图像

<img [(src)]="linkPicture" alt="profile photo" width="450px" height="450px">

但是这不起作用。我必须在哪里放置时间戳记？在网址末尾？还是喜欢我已经拥有？

我的img向我发送了第一个“ linkPicture”，但不会重新加载...控制台每2秒显示一次。新的linkPicture

Answer 1

您的this.linkPicture变量是您的interval函数的内部变量，仅存在于该范围内。这意味着您实际上并没有在外部更新变量。

如果您正在使用babel，则可以将间隔中的函数设置为箭头函数（）=> {您的代码在这里...}，那么这将意味着外部作用域。

setInterval(() => {
    this.timeStamp = (new Date()).getTime();
    this.linkPicture = "http://192.168.178.28/tmpfs/auto.jpg?"+this.timeStamp+"&user=USER&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+"&user=USER&pwd=PASSWORD" ;
    console.log(this.linkPicture);
}.bind(this), 2000);

您还可以将其保留在linkPicture变量之前，并将上面的linkPicture变量声明为var linkPicture =“ your url”，然后可以将其设置为间隔，就像linkPicture =“ your new url”

最排序的解决方案就是在您的函子内部：linkPicture = this.linkPicture

如何自动重新加载相机快照

1 个答案: