Hiding or Showing an ActionItem in Angular

In this snippet, Rachid shows that hiding or showing an ActionItem is easy in Angular

  •         
    import {Component, OnInit} from '@angular/core';
    @Component({
      moduleId: module.id,
      selector: "gf-list-detail",
      templateUrl: "list-detail.html"
    })
    export class ListDetailComponent implements OnInit {
    	public isEditing:boolean;
      
      constructor() {
        
      }
      
      ngOnInit() {
      	this.isEditing = false;
      }
      
    	onEdit(){
      		this.isEditing = true;
    	}
      
    	onCancel(){
      		this.isEditing = false;
    	}
      
    }
            
        

  •         
    <ActionBar class="action-bar" title="">
        <NavigationButton text="back" android.systemIcon="ic_menu_back" (tap)="back()"></NavigationButton>
          <ActionItem (tap)="onEdit()" ios.systemIcon="2" android.systemIcon="ic_menu_edit" ios.position="right"
                        visibility="{{ isEditing ? 'collapse' : 'visible' }}">
          </ActionItem>
          <ActionItem (tap)="onCancel()"  ios.systemIcon="1" android.systemIcon="ic_menu_close_clear_cancel"
                        visibility="{{ isEditing ? 'visible' : 'collapse' }}">
          </ActionItem>
          <ActionItem (tap)="editArticle(id)"
                ios.systemIcon="3" ios.position="left"
                android.systemIcon="ic_menu_save" android.position="actionBar"
                visibility="{{ isEditing ? 'visible' : 'collapse' }}">
          </ActionItem>
          <ActionItem (tap)="onSelectSingleTap()"
                ios.systemIcon="15" ios.position="left"
                android.systemIcon="ic_menu_gallery" android.position="actionBar"
                visibility="{{ isEditing ? 'visible' : 'collapse' }}">
          </ActionItem>
          <ActionItem (tap)="takePhoto()"
                ios.systemIcon="15" ios.position="left"
                android.systemIcon="ic_menu_camera" android.position="actionBar"
                visibility="{{ isEditing ? 'visible' : 'collapse' }}">
          </ActionItem>
        <ActionItem (tap)="goHome()"
                ios.systemIcon="9" ios.position="left"
                android.systemIcon="ic_menu_home" android.position="actionBar">
          </ActionItem>
        <ActionItem (tap)="logout()" android.position="popup" ios.position="left" text="خروج">
          </ActionItem>
    </ActionBar>