离子 ng-if 产生错误 - 离子 3答案

【问题标题】：Ionic ng-if generates error - ionic 3离子 ng-if 产生错误 - 离子 3
【发布时间】：2017-07-07 14:21:22
【问题描述】：

我正在尝试在离子应用程序中实现从 api 接收的产品类别。但是在实现相同的时候我得到了以下错误

Error: Template parse errors:
Can't bind to 'ng-if' since it isn't a known property of 'div'."

代码如下：

  <div class="width50" *ngFor="let object of dataList">
    <div *ng-if= "{{object?.categories[0]?.slug}} == single">
    <img src="{{object.images[0].src}}" width="150"  (click)="navigateToPage(object.id)" />
    </div>
  </div>

当我打印{{object?.categories[0]?.slug}} 的值时，代码运行良好并返回单个。

在 *ng-if 上使用 *ngif 似乎也不起作用，它会显示以下错误。

`Template parse errors:
TypeError: key[0] is undefined ("
<ion-content padding>
  <div class="width50" *ngFor="let object of dataList">
    <div [ERROR ->]*ngIf= "{{object?.categories[0]?.slug}} == single">
    <img src="{{object.images[0].src}}" width="15"): ng:///AppModule/SinglePage.html@21:9
Can't bind to '*ngIf' since it isn't a known property of 'div'. "`

我相信这可能会发生，因为也许并非所有对象都有值是类别数组。那么有没有办法确保只有在确保类别数组非空之后才检查*ng-if= "{{object?.categories[0]?.slug}} == single" 条件？我们也可以在同一个div上同时拥有条件和循环吗？

【问题讨论】：

它的 *ngIf ..!!!
Angular 中没有 ng-if 指令。你应该改用*ngIf
我在这里提到：stackoverflow.com/questions/34766128/…
Ionic 2/3 在 Angular（而不是 AngularJS）之上工作，因此在寻找如何在 Ionic 2/3 中做事时，请确保您正在寻找带有 angular 和不是angularjs

标签： angular ionic3 angular-ng-if

【解决方案1】：

你犯了一个类型错误，应该是“*ngIf”而不是“ng-if”，

替换这一行，

<div *ng-if= "{{object?.categories[0]?.slug}} == single">

与

<div *ngIf= "object?.categories[0]?.slug == single">

问题是您正在尝试将 object?.categories[0]?.slug 插入 *ngIf 条件中的字符串。去掉花括号{{}}，你的代码就可以正常运行了

【讨论】：

这似乎不起作用，根据收到的错误更新问题。
又打错了！它不是“ngif”，而是“ngIf”。更具体的大写“I”
也尝试过大写，但问题依旧。
我相信这可能会发生，因为也许并非所有对象都有值是类别数组。那么有没有办法确保只有在确保类别数组非空之后才检查slug条件？更新了问题以获取更多详细信息。
“模板解析错误”并非如此。你能把你的html代码贴在这里吗？