Angular 2无法绑定到'ngif'，因为它不是已知属性[重复]答案

【问题标题】：Angular 2 Can't bind to 'ngif' since it isn't a known property [duplicate]Angular 2无法绑定到'ngif'，因为它不是已知属性[重复]
【发布时间】：2017-03-18 12:13:31
【问题描述】：

我正在尝试使用 Angular 2。我有一个包含两个组件的工作测试应用程序。一切正常，但是当我尝试使用*ngif时它崩溃了@

已经有很多关于这个问题的问题，但大多数答案都指向导入“BrowserModule”来解决问题。就我而言，我已经这样做了。还有什么可能导致这个问题？

我的 html

<table class='table' *ngif="products && products.length">

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent }  from './app.component';
import { CrazyComponent }  from './products/crazy.component';

@NgModule({
      imports: [ BrowserModule ],
      declarations: [ AppComponent, CrazyComponent ],
      bootstrap: [ AppComponent ]
})
export class AppModule { }

完整错误：

无法绑定到“ngif”，因为它不是“table”的已知属性。嵌入式模板上的任何指令均未使用属性绑定 ngif。确保属性名称拼写正确，并且所有指令都列在“指令”部分

【问题讨论】：

这能回答你的问题吗？ Can't bind to 'ngIf' since it isn't a known property of 'div'

标签： angular typescript angular-ng-if

【解决方案1】：

你有一个错字。使用ngIf 而不是ngif

正确使用方法：

 <table class='table' *ngIf="products && products.length">

更新：

很多人（包括我）都遇到了这个问题，因为 IntelliJ IDEA/WebStorm 自动补全给出了无效的ngif。此外，IDEA 将 *ngIf 突出显示为无效。

最近我将我的 IDEA 升级到 2017.2.5 以及 JS/Angular 插件，这个问题就消失了。此外，我得到了更好的 NG2+ 自动补全和更好的 TypeScript 支持。这就是我强烈建议升级 JetBrains 软件的原因。

【讨论】：

请耐心等待，发布问题后不能立即标记答案。
我遇到这个是因为 IntelliJ 的自动完成功能给了我 ngif
@DanielCheng 也没有建议正确的，您得到的唯一错误是该属性不允许存在，有时在您离开编辑该特定页面之后。非常烦人！

【解决方案2】：

你有一个错误，因为“*ngif”正确的是“*ngIf”。这里的大写“I”和 *ngFor 中的大写“F”..我曾经打错了很多次。请耐心一点。 :)

【讨论】：