Question

<div class="text">{{message}}</div>

private message = 'Some message';

ngOnInit() {
    this.setMessageToDisplay();
}   

       setMessageToDisplay() {
          if (this.packageService.isDocPackageEmpty) {
                if(this.router.url === '/documents/todo') {
                    this.message = 'M1';
                }
                else if (this.router.url === '/documents/done') {
                    this.message = 'M2';
                }
                else if (this.imageService.isVisiblePatientDocList()) {
                    let pacientId = this.router.url.split("/")[2];
                    this.message = "M3";
                }
            } else {
                this.message = 'Def Message';
            }
            return this.message;
        }
    }

尽管在方法this.setMessageToDisplay（）中更改了值，但使用{{message}}显示了此变量的初始值。我在html <div class="text">{{setMessageToDisplay()}}</div>中执行类似这样的操作但是方法执行的次数很少，我希望只显示消息变量的最后一个值。是否可以在html和刷新视图中设置{{message}}？

Answer 1

您可以使用ChangeDetecorRef模块手动调用更改检测：

import {ChangeDetectorRef} from @angular/core

constructor(private ref:ChangeDetectorRef){}

ngOnInit() {
    this.setMessageToDisplay();
    this.ref.detectChanges();
}

Answer 2

试试这个改变：

<div class="text">{{message}}</div>

public message = 'Some message';

ngOnInit() {
    this.message = this.setMessageToDisplay();
}   

       setMessageToDisplay() {
          let message: string;
          if (this.packageService.isDocPackageEmpty) {
                if(this.router.url === '/documents/todo') {
                    message = 'M1';
                }
                else if (this.router.url === '/documents/done') {
                    message = 'M2';
                }
                else if (this.imageService.isVisiblePatientDocList()) {
                    let pacientId = this.router.url.split("/")[2];
                    message = "M3";
                }
            } else {
                message = 'Def Message';
            }
            return message;
        }
    }

请记住设置public您的消息

更改数据后的角度更新视图

2 个答案: