【问题标题】:Angular, callback doesn't change variable角度,回调不会改变变量
【发布时间】:2019-03-10 18:04:47
【问题描述】:

我有以下sn-p

这是我的 ma​​in.html

<h2 class="txtcenter po-2text" style="padding-top:30px">
    {{title}}
</h2>

这是我的 ma​​in.ts

title: string;

ngOnInit() {
    var self = this;
    var ref = firebase.database().ref('schools/' + this.currentUserId());
    ref.orderByChild('title').on('value', function(dataSnapshot) {
        console.log("Title is: " + dataSnapshot.val().title);
        self.title = dataSnapshot.val().title;
    });
}

即使使用一些有效数据触发回调,标题也不会自动更新。我错过了什么?

感谢任何帮助!

【问题讨论】:

  • 你能创建一个工作样本吗?如果可能,您可以尝试创建StackBlitz。还可以尝试将语法更改为粗箭头函数语法并检查是否有帮助。尝试像这样更改您的ngOnInitngOnInit() { const ref = firebase.database().ref('schools/' + this.currentUserId()); ref.orderByChild('title').on('value', dataSnapshot =&gt; this.title = dataSnapshot.val().title); }
  • @LuigiCapgrosso 所以console.log 工作正常吗?
  • 您可能需要检查github.com/angular/angularfire2
  • 是的,console.log 工作正常

标签: angular typescript firebase firebase-realtime-database


【解决方案1】:

Angular 更改检测基于浏览器事件工作,因为这是一个触发基础事件回调,因此不会触发更改检测。所以试试下面的

导入 NgZone:

import { Component, NgZone } from '@angular/core';

将其添加到您的类构造函数中

constructor(public zone: NgZone, ...args){}

使用 zone.run 运行代码:

ref.orderByChild('title').on('value', (dataSnapshot) => {
        console.log("Title is: " + dataSnapshot.val().title);
        this.zone.run(() => this.title = dataSnapshot.val().title;)
});

【讨论】:

  • @LuigiCapogrosso :)
猜你喜欢
  • 2014-01-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-10-21
  • 1970-01-01
  • 2015-08-21
  • 2014-02-05
  • 2017-09-28
相关资源
最近更新 更多