Angular：ngInclude 和 ngBindHtml 不是 div 的已知属性答案

【问题标题】：Angular: ngInclude and ngBindHtml is not a known property of divAngular：ngInclude 和 ngBindHtml 不是 div 的已知属性
【发布时间】：2017-06-28 05:12:22
【问题描述】：

您好，过去几天我一直在尝试学习 Angular，我想使用 ngHtmlBind 或 ngInclude 指令。但是，当我使用它并为我的应用程序提供服务时，控制台会这样说：

未捕获的错误：模板解析错误：
无法绑定到“ngBindHtml”，因为它不是“div”的已知属性。

未捕获的错误：模板解析错误：
无法绑定到“ngInclude”，因为它不是“div”的已知属性。

我在阅读文档时不知所措。也许是因为我使用的是 CLI 并且指令的调用方式不同（即，它不是 'ng-for'，而是实现为 *ngFor）？

我尝试了 ngFor 和 ngIf，它们工作正常。但是当我使用 ngBindHtml 和 ngInclude 时，就会出现错误。

这是我的代码：

app.module.ts

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

import { AppComponent } from './app.component';
import { SonglistComponent } from './songlist/songlist.component';
import { ChartComponent } from './chart/chart.component';

import { DataService } from './data.service';
import { SafePipe } from './safe.pipe';

@NgModule({
  declarations: [
    AppComponent,
    SonglistComponent,
    ChartComponent,
    SafePipe
  ],
  imports: [
    BrowserModule
  ],
  providers: [DataService],
  bootstrap: [AppComponent]
})
export class AppModule { }

chart.component.html

<div class="chart" *ngFor="let song of dataService.currentPlaylist">
    <div class="chart-options">
        <span class="glyphicon glyphicon-remove" aria-hidden="true" (click)="closeChart()"></span>
    </div>
    <h1 class="chart-title">{{song.title}}</h1>
    <p class="chart-artist">by {{song.artist}}</p>
    <p class="chart-key">Key: {{song.key}}</p>
    <div class="chart-body" *ngBindHtml="song.chart">
    </div>
</div>

【问题讨论】：

你在哪里看到ngHtmlBind和ngInclude这样的指令？
@yurzui 我正在阅读文档。这是 ngBindHtml 文档的链接：docs.angularjs.org/api/ng/directive/ngBindHtml
但是你使用的是 angular2 不是吗？
@yurzui 不。我通过 CLI 使用 Angular 4。
好吧，我应该改写一下：您使用的是 angular 而不是 angularjs

标签： angular angular-cli

【解决方案1】：

angular 中没有内置指令ngBindHtml。它来自 angularjs

您应该改用innerHTML 属性：

<div class="chart-body" [innerHTML]="song.chart"></div>

请参阅 angular 文档的 模板语法 部分（同样，不是 angularjs）了解更多信息： https://angular.io/guide/template-syntax

【讨论】：