Javascript ngIf不更新DOM

我在函数内的ts文件中有一个变量

isLTEavailable

。根据a条件调用函数时，

isLTEavailable

的值会更改并正确记录，但由于某些原因，它不会在DOM中更新

以下是我的ngif条件：

<li class="nav-item dropdown" *ngIf="isLTEavailable">

我还使用字符串插值打印了变量，即使控制台正确更新，它的值始终显示为true

---

p.S.

isLTEavailable

初始化为true。

利用Angular的可观测值

在TS文件中：

宣布：

  import { Observable } from 'rxjs';
  isLTEavailable : Observable<boolean> ; 

  //and in your function
  console.log("Lte --", lte_id)

  if (lte_id != undefined) {
    sessionStorage.setItem("lte_customer_id", lte_id.toString())
    this.isLTEavailable = new Observable(observer=>observer.next(true));
  } else {
    sessionStorage.setItem("lte_customer_id", 'n/a')
    this.isLTEavailable = new Observable(observer=>observer.next(false));
  }

从'rxjs'导入{Observable}；
可观测的：可观测的；
//在你的功能中
log（“Lte--”，Lte\U id）
如果（lte_id！=未定义）{
setItem（“lte\U客户id”，lte\U id.toString（））
this.isLTEavailable=新的可观察对象（observer=>observer.next（true））；
}否则{
sessionStorage.setItem（“lte_客户识别码”，“不适用”）
this.isLTEavailable=新的可观察对象（observer=>observer.next（false））；
}

然后在HTML中使用异步管道：

 <li class="nav-item dropdown" *ngIf="isLTEavailable | async">

以下是我为您准备的工作示例：

---

也许您可以像这样使用ChangeDetectorRef

这个。_ChangeDetectorRef.detectChanges（）

据

更改检测在回调或订阅方法中的变量发生更改时失败。 可以使用

 ngZone.run(() => { this.isLTEavailable = false }) 

以更新值。 （或） 通过以下操作手动触发更改检测

import {ChangeDetectorRef} from '@angular/core'
constructor(private ref: ChangeDetectorRef){}


//after variable update
this.ref.detectChanges();

---

让我知道这是否有效。谢谢大家在这里进行了健康的讨论。我发现了我的代码的问题，并修复了它，现在插值工作如预期。问题在于Ngonit内部isLTEavailable变量的初始化，这导致每当调用函数时，它都会被更新回原始状态。再次感谢你帮助我。我学习了changeDetection函数，并从您的答案中学习了如何使用可观测值作为替代。非常感谢。非常感谢。

你试过isLTEavailable==true吗？是的，我试过了。仍然是相同的问题如果您提供工作演示，我需要查看您的条件以及您在哪里调用函数在哪里运行此函数？只需使用插值显示值，即

{{isLTEavailable}

在列表项上方，并确保值已更改。由于某种原因，这总是将其设置为false，即使是在if条件内，而不是其他条件下。我发布的答案就是一个工作示例。我为同样的人发布了stackblitz，这不是我的明智之举。我的声誉太低，我的投票结果无法解释任何变化。好的，我会尝试为您提供一个工作示例，确保您的代码正确无误。您能看看我发布的示例吗？没有变化。detectChanges（）返回undefinedhave调用detectChanges（）后您是否尝试将其注销？是的，我尝试过。该函数返回未定义且变量值正确更改是否可以仅使用骨架创建stackBlitz？无更改。detectChanges（）返回UndefinedChanges（）你能在stackblitz举个例子说明这个问题吗@UjjwalSharma

 ngZone.run(() => { this.isLTEavailable = false }) 

import {ChangeDetectorRef} from '@angular/core'
constructor(private ref: ChangeDetectorRef){}


//after variable update
this.ref.detectChanges();