ionic angular works differently for ng-bind and {{}} don't know why?

I am trying to implement ionic UI with its blank template. here is my home.ts file thats inside /pages/home/ folder.

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);
  }
}

and here is home.html file.

<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>

here if i use {{item.text}} instead of than value get display but i want to know why ng-bind is not working as rendering frequency of ng-bind is higher than {{}}.