代码之家  ›  专栏  ›  技术社区  ›  Boas Enkler

当变量从oberservable subscribe更新时,Angular 2-*ngif不刷新

  •  27
  • Boas Enkler  · 技术社区  · 8 年前

    在html中,“我有警告”仅在出现错误状态时显示,如thius

    <div class="alert alert-danger" *ngIf="error">
        <strong>Not saved!</strong> There was an error when saving the project. Please try again later.
    </div>
    

    这很好。但是当我从一个可观察对象设置值时,ngIf不会得到更新的值。

    这里是简化代码,它总是将错误设置为true,用于测试目的

    export class createProjectComponent {
        constructor(private service:ProjectsService){
    
        }
    
        model = new myModel();
        error = false;
        submitForm(){    
            this.service.createProject(this.model).subscribe(i=>{
                this.error=true;
              }
        }
    

    有什么我必须触发的通知吗?

    2 回复  |  直到 8 年前
        1
  •  51
  •   Günter Zöchbauer    8 年前

    如果这解决了您的问题,您可以尝试:

    constructor(private cdRef:ChangeDetectorRef) {}
    
    submitForm(){    
        this.service.createProject(this.model).subscribe(i=>{
            this.error=true;
            this.cdRef.detectChanges();
        }
    }
    

    如果是,则有一些代码 this.service.createProject(this.model) 这导致执行离开安格拉斯区。

    使现代化

    如果你使用,你不需要这个 ()=> 到处 function () 如果你不按名字传递函数,比如 someFunc(mycallback) 而是 someFunc(() => mycallback()) someFunc(mycallback.bind(this))

        2
  •  3
  •   Boas Enkler    8 年前

    找到错误。这个 this 观察中的变化 指向OSBerable,不再指向组件。

    因此,我必须获得组件对变量的引用,并将该引用上的错误设置为true。

    工作代码如下所示:

    var component = this;
    
    this.service.createProject(this.model).subscribe(i=>{
                    component.error = true;