Question

我的代码的这一部分有错误

<img src="../../../assets/gms-logo.png" alt="logo" routerLink="/overview" alt="website icon">

但是，当我检查资产文件夹时，gms-logo.png仍在那里，而在angular-cli.json中，资产也在那里。路径也是正确的。

最近，我一直在研究搜索功能。所以我的假设是，

即使用户仍未关注输入类型，程序是否已开始搜索？我该如何解决这个问题？

下面是我的搜索html及其建议段

的显示

<input type="text" placeholder="Search" (keyup)="onSearch($event.target.value)">        
<div class="suggestion"  *ngIf="results.length > 0">
     <div *ngFor="let result of results ">
          <a href="" target="_blank">
                {{ result.name }}
          </a>
     </div>
</div>

以下是我的组件

results: Object;



 onSearch(name) {
            this.search
            .searchEmployee(name)
            .subscribe(
                name => this.results = name,//alert(searchName),this.route.navigate(['/information/employees/']),
                error => alert(error),
                );
}

Answer 1

您需要将results变量初始化为数组。

在您的组件中，添加：

results = [];

另一种选择是更改建议div的*ngIf语句，以检查是否定义了results：

<div class="suggestion"  *ngIf="results">
   <div *ngFor="let result of results ">
          <a href="" target="_blank">
                {{ result.name }}
       </a>
   </div>
</div>

Answer 2

The safe navigation operator ( ?. ) and null property paths

Angular安全导航运算符（？。）是防止属性路径中的空值和未定义值的一种流畅便捷的方法。就是这样，如果currentHero为null，则可以防止视图渲染失败。

因此，在您的示例中，您还可以使用安全导航操作符（？。）：

<div class="suggestion"  *ngIf="results?.length > 0">
    <div *ngFor="let result of results ">
        <a href="" target="_blank">
            {{ result.name }}
        </a>
    </div>
</div>

Answer 3

将变量初始化为空解决了我的问题。

 DoctorList: any[] = [];

Answer 4

我陷入了类似的情况，即使将results分配为数组 （如下所示），错误仍然存在。

results: Array<any>;

使用'？' （安全导航操作员）对我来说很好。

*ngIf="results?.length"

安全导航操作符（？）可用于防止Angular在尝试访问不存在的对象的属性时引发错误。

仅当length的值不是 Null 或 Undefined 时，本示例才会评估results。

Answer 5

您可以在声明中初始化数组：

    result: Array<any>;

如果问题样式仍然存在，则应在此方法中检查null：

onSearch(name) {
        this.search
        .searchEmployee(name)
        .subscribe(
            name =>
if(name!=null){
this.results = 
name,//alert(searchName),this.route.navigate(['/information/employees/']),
}

            error => alert(error),
            );
}

Answer 6

我遇到了同样的问题。我发现了两种修复方法

将结果分配为数组

result = []

以html

*ngIf="results.length"

使用？

* ngIf =“ results？.length”

错误TypeError：无法读取未定义的属性“length”

6 个答案: