无法隐藏角度 4 中的错误消息答案

【问题标题】：Unable to hide error msg in angular 4无法隐藏角度 4 中的错误消息
【发布时间】：2018-05-16 14:04:14
【问题描述】：

如果没有数据我想显示一些消息。我已经为此编写了逻辑并且它有效。但是，如果有一些数据，那么它也会显示相同的消息。不知道为什么它不能正常工作。非常感谢您的帮助。

我的打字稿组件中的逻辑

  validation: boolean; 

  constructor( ) {
    this.validation = false;
  }
searchEmployee(name: string): void {
    var config = {
        headers: {
            'Content-Type': 'application/json'
        }
    };
    const empName = name;
    let obj = { empNamewers: empName }
    let body = JSON.stringify(obj);
    let headers = new HttpHeaders();
    headers = headers.append('Content-Type','application/json');
     this.httpClient.post<Employee[]>('sercvicesUrl', body, config).subscribe( employees => {
        this.employees = employees;
         console.log(employees);
      if(this.employees.length === 0){
       this.validation=true;
        }
     else{
       this.validation=false;        
    }
    });

    }

这是 HTML 文件

     <button (click)="searchEmployee(searchBox.value);">Search</button>
     <div *ngIf="validation">
    <h4>Sorry, No results</h4>
    </div>

【问题讨论】：

不应该是
吗？
那么，应该是什么？
你缺少空间吗？
在没有数据的情况下可以正常工作，但即使有数据也会显示这个消息。
粘贴时我错过了，否则在实时代码中我有空间。

标签： angular angular4-forms

【解决方案1】：

您的代码几乎没有问题。首先，您不应该在构造函数中分配类变量。这不是构造函数的用途。如果你这样分配它：

validation = false;

constructor() {}

然后，它将在角度生命周期之前分配。

其次，在您的支票中：

if(this.employees.length === 0 || this.employees.length === null){

这是不正确的。长度不能为空；应该是：

if (!this.employees || this.employees.length === 0) {

}

以下是您尝试实现的工作示例：

https://stackblitz.com/edit/angular-ypaaea?file=src%2Fapp%2Fapp.component.ts

【讨论】：

我已经更新了代码，但它似乎不起作用。

【解决方案2】：

你可以试试下面的代码吗：

if(this.employees.length > 0){
    //Write you logic here
         this.validation=false;
 }
    else{
          this.validation=true;        
}

即使您没有任何匹配的数据，也请始终确保将空数组 ('[]') 作为 API 响应返回。

【讨论】：

感谢您的宝贵时间，但它也不是这样工作的。