Enable ion-navbar button while submitting from modal page - html

Question

import { Component } from '#angular/core';
import { NavController, NavParams } from 'ionic-angular';
import {ModalPage} from '../modal-page/modal-page';
#Component({
selector: 'page-page2',
templateUrl: 'page2.html'
})
export class Page2 {
selectedItem: any;
icons: string[];
items: Array<{title: string, note: string, icon: string}>;
public nb:ModalPage;
constructor(public navCtrl: NavController, public navParams: NavParams) {
// If we navigated to this page, we will have an item available as a nav param
this.selectedItem = navParams.get('item');
// Let's populate this page with some filler content for funzies
this.icons = ['flask', 'wifi', 'beer', 'football', 'basketball', 'paper-plane',
'american-football', 'boat', 'bluetooth', 'build'];
this.items = [];
for (let i = 1; i < 11; i++) {
this.items.push({
title: 'Item ' + i,
note: 'This is item #' + i,
icon: this.icons[Math.floor(Math.random() * this.icons.length)]
});
}
}
itemTapped(event, item) {
// That's right, we're pushing to ourselves!
this.navCtrl.push(Page2, {
item: item
});
}
enablebuttonn(){
if ( this.nb.login()){
console.log("button va être activée");
}
}
}
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Page Two</ion-title>
<ion-buttons end>
<button ion-button icon-left>
<ion-icon name="paper"></ion-icon>
<span class="hide-xs">news</span>
</button>
<button ion-button #button1 disabled="true" icon-left (click)="enablebuttonn()">
<ion-icon name="car"></ion-icon>
<span class="hide-xs">voiture</span>
</button>
<button ion-button icon-left (click)="showAlert()">
<ion-icon name="chatbubbles"></ion-icon>
<span class="hide-xs">messages</span>
</button>
<button ion-button icon-only >
<ion-icon name="more"></ion-icon>
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content>
<ion-list>
<button ion-item *ngFor="let item of items" (click)="itemTapped($event, item)">
<ion-icon [name]="item.icon" item-left></ion-icon>
{{item.title}}
<div class="item-note" item-right>
{{item.note}}
</div>
</button>
</ion-list>
<div *ngIf="selectedItem" padding>
You navigated here from <b>{{selectedItem.title}}</b>
</div>
</ion-content>
I'm working in a new mobile app with Ionic 2, and I'm trying to enable a button located in the ion-navbar while having success submitting from a modal page.
this a screenshot : voiture button ( in the top right ) is in the beginning disabled , i would like enable it while submitting.enter image description here
here is my page2 page ,ts file and the modal page

Answer 1

<button ion-button #button1 [disabled]="showButton" icon-left (click)="enablebuttonn()">
Notice the [] around the disabled attribute. This allows you to add logic to the attribute.
And then in the click event you can trigger the property to true
showbutton:boolean = false;
....
constructor(){
}
....
itemTapped(event, item) {
this.showbutton = true;
...
}