Question 49968 in Javascript Question posted in
A very good W3school tutorial can be found here.

How to add a line break? – Javascript

let errores = Object.values(this.errores)
let stringError = ""
for (let index = 0; index < errores.length; index++) {
  stringError += errores[index] + "n"
}
return stringError

How can get a line break which basically returns a string?

  • This is on angular ionic with an alert controller
  • I’m putting this error on the message

I tried whit a br but, I’m not getting a line break.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Hi i solved this by adding

    on app.module.ts this:

    @NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserModule,
        IonicModule.forRoot({ innerHTMLTemplatesEnabled: true }),
        AppRoutingModule,
        HttpClientModule
],

    setting innerHTMLTemplatesEnabled: true will enable to use IonicSafeString on IONIC 7, so when i return string will be like this:

    enter image description here


  2. 0

    To display line breaks in an Ionic alert controller, you need to use HTML tags and set the message property to interpret the message as HTML. You can achieve this by using the innerHTML property in the message attribute of the Alert Controller.

    Here’s how you can do this:

    1. Modify your code to use the <br> tag for line breaks:

      let errores = Object.values(this.errores);
let stringError = "";
for (let index = 0; index < errores.length; index++) {
   stringError += errores[index] + (index < errores.length - 1 ? "<br>" : "");
}

    2. When creating the alert, use the message property to set the innerHTML:

      async presentAlert() {
  const alertController = document.querySelector('ion-alert-controller');
  await alertController.componentOnReady();

  const alert = await alertController.create({
    header: 'Error',
    message: stringError, // Use your stringError variable here
    buttons: ['OK'],
    cssClass: 'multiline-alert', // Add a custom class for styling
  });
  await alert.present();
}

    3. In your global.scss or the relevant stylesheet, add the following CSS rule to enable innerHTML interpretation for the alert message:

      .multiline-alert .alert-message {
  white-space: pre-wrap;
}

    This will allow you to display the error messages with proper line breaks in your Ionic alert controller.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search