Как изменить ярлык с обратной кнопки в Ionic 2?

Ответ 1

Вы можете установить текст кнопки назад в файле app.html, как указано в ионной ссылке http://ionicframework.com/docs/v2/api/config/Config.

@App({
  template: '<ion-nav [root]="root"></ion-nav>'
  config: {
    backButtonText: 'Go Back',
    iconMode: 'ios',
    modalEnter: 'modal-slide-in',
    modalLeave: 'modal-slide-out',
    tabbarPlacement: 'bottom',
    pageTransition: 'ios',
  }
})

ОБНОВЛЕНИЕ в ионной 2 бета 8

import {ionicBootstrap} from 'ionic-angular';

ionicBootstrap(AppRoot, customProviders, {
  backButtonText: 'Go Back',
  iconMode: 'ios',
  modalEnter: 'modal-slide-in',
  modalLeave: 'modal-slide-out',
  tabbarPlacement: 'bottom',
  pageTransition: 'ios',
});

ОБНОВЛЕНИЕ в ионном 2 rc.0 и выше, а также в ионном 3

В ionic 2 rc.0 и выше нам нужно включить конфиги в app.module.ts в массиве import.

@NgModule({   
 declarations: [
    MyApp,
    Home   
 ],   
 imports: [
    IonicModule.forRoot(MyApp, {
      tabsPlacement: 'top',
      backButtonText: 'Back'
     })],
 bootstrap: [IonicApp],
 entryComponents: [
    MyApp,
    Home   ],
 providers: [MyService]
})

Ответ 2

Текущая версия IONIC2 позволяет вам изменять текст обратной кнопки по всему миру.

Вы также можете изменить значок, как он отображается в ios, и скрыть метку "Back".

imports: [
    IonicModule.forRoot(MyApp,{
      backButtonText: '',
      backButtonIcon: 'ios-arrow-back',
      iconMode: 'md'
    })
]

Просто добавьте это в свой app.module.ts.

Ответ 3

Я потратил некоторое время на то, как это сделать с помощью ViewController в Ionic 2.

Внутри файла typescript для вашей страницы вы должны импортировать ViewController

import { ViewController } from 'ionic-angular';

Затем в вашей конструкторской функции есть ViewController.

constructor(public viewCtrl: ViewController) {}

Затем вы можете вызвать функцию для изменения текста.

ionViewDidLoad() { this.viewCtrl.setBackButtonText('Cancel'); }

Я в основном собрал это вместе из того, как я делал "Оповещения" и "Навигатор", поэтому я могу ошибаться. Это работает для меня, хотя и имеет преимущество, позволяя мне изменить текст на каждой странице.

Ответ 4

Я тоже не нашел никакой документации. Но я нашел файл, который устанавливает текст и класс кнопки, поэтому вы можете редактировать его там (он изменит текст/класс кнопки на каждой странице).

Измените атрибут backButtonText в node_modules/ionic-framework/config/modes.js

Ответ 5

Если вы используете ионный 4, вы можете установить текст кнопки назад, как это

<ion-back-button [text]="'<your text>'"></ion-back-button>

Ответ 6

Здесь официальная документация https://ionicframework.com/docs/v3/api/config/Config/

есть хороший пример использования в стартовом приложении ionic 3

В конструкторе app.component.ts используется метод "set", используемый для объекта Config из ионно-угловых:

this.config.set('ios', 'backButtonText', values.BACK_BUTTON_TEXT);

Полезно, когда вы хотите использовать интернационализацию или динамически изменять настройки:

this.translate.get(['BACK_BUTTON_TEXT']).subscribe(values => {
  this.config.set('ios', 'backButtonText', values.BACK_BUTTON_TEXT);