Angular 2 无法绑定到 'ngif'，因为它不是已知的属性

Question

我正在试验 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 未被嵌入式模板上的任何指令使用。确保属性名称拼写正确并且所有指令都列在 "directives" 部分

Answer 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 软件。

Answer 2

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

Angular 2 无法绑定到 'ngif'，因为它不是已知的属性

Angular 2 Can't bind to 'ngif' since it isn't a known property

typescript

angular-ng-if

angular

Angular 2 无法绑定到 'ngif'，因为它不是已知的 属性

Angular 2 Can't bind to 'ngif' since it isn't a known property

typescript

angular-ng-if

angular

Angular 2 无法绑定到 'ngif'，因为它不是已知的属性