离子角度对于 ng-bind 和 {{}} 的工作方式不同，不知道为什么？答案

【问题标题】：ionic angular works differently for ng-bind and {{}} don't know why?离子角度对于 ng-bind 和 {{}} 的工作方式不同，不知道为什么？
【发布时间】：2017-10-30 20:43:37
【问题描述】：

我正在尝试使用其空白模板来实现 ionic UI。这是我的 home.ts 文件，位于 /pages/home/ 文件夹中。

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  items = [
   {id: 1,text:"first"},
   {id: 2,text:"second"},
   {id: 3,text:"third"},
   {id: 4,text:"forth"}
];
  constructor(public navCtrl: NavController) {}
  itemSelected(item){   
    item.text+=" Checked";
    alert(item.text);
  }
}

这里是 home.html 文件。

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>
<ion-content padding>
  <ion-list inset>    
  <button ion-item *ngFor="let item of items" (click)="itemSelected(item)">
    <p>{{ item.id }} <span ng-bind="item.text"></span></p>    
  </button>
</ion-list>
</ion-content>

这里如果我使用 {{item.text}} 而不是值得到显示，但我想知道为什么 ng-bind 不能作为渲染频率ng-bind 高于 {{}}。

【问题讨论】：

那么你在span 中得到了什么？
@Mr_Perfect 什么都没有。

标签： javascript angular typescript ionic-framework

【解决方案1】：

ng-bind 是 AngularJS (Angular 1) 指令。如果您想以其他方式进行绑定，请使用[innerHTML] 属性绑定。

<p>{{ item.id }} <span [innerHTML]="item.text"></span></p>

【讨论】：

谢谢@PankajParkar anoop 比你早了 4 分钟。所以我选择了他的答案。
@NisargDesai 我不介意......但我比他早回答了 1 分钟......你可以检查回答时间，谢谢 :)
@NisargDesai 这个答案是第一个
@NisargDesai, PankajParkar ：我也不介意。，你的问题需要解决.. 发帖前我没有注意到他的回答.. :)
谢谢你们俩。你们俩都有很强的工程精神。

【解决方案2】：

ng-bind 不是 angular2 的一部分，请改用[innerHTML]，

【讨论】：

好的，知道了。现在可以了。我没有在 ionic 3.0 中没有升级包依赖项。谢谢
很高兴为您提供帮助 :)，是的 angular2 更多的是使用现有的 HTML 属性。而不是自定义。

【解决方案3】：

我认为这是 angular 1 风格。对于 Angular 2，我使用

【讨论】：

【解决方案4】：

&lt;span [innerHTML]="item.text"&gt;&lt;/span&gt;&lt;/p&gt;

【讨论】：