New line in ionicpopup content

Question

Is it possible to have a newline in the content of ionicpopup?

I am trying to do this:

  $ionicPopup.alert({
                  title: 'Now what?',
                  content: "To start receiving messages: \n"
                           + "        - Open the side menu (button on top left) \n"
                           + "   - Tap 'Add Organisations' \n"
                           + "   - Browse the list of organisations available \n" 
                           + "or \n"
                           + "   - Enter a Passphrase to join a private group. \n \n"
                           + "Once you've subscribed to an organisation, you'll start receiving messages from them.",
                  buttons: [
                            { text: "Don't show me again" },
                            {
                              text: 'Okay',
                              type: 'button-positive'
                            }
                          ]
                }).then(function(res) {
                  if(res) {
                        console.log('You are sure');
                  } else {
                    console.log('You are not sure');
                  }
            });

My newlines do not work. I see the content in the popup as one long paragraph with no new lines.

Is it possible?

Answer 1

Yes, there may be a newline character in ionic pop-up content.

Replace \ n with br> and it works. The ionic structure outputs HTML after executing this javascript. It also works with a single quote string of an html string.

Answer 2

you can use break as below

strMessage:any;
strEmpName:any;


strMessage: 'Hi Team,'+'<br\><br\> Please find the Employee Name'+'<br\><br\>' + this.strEmpName+'<br\><br\>'+'Thanks & Regards'+'<br\>'+'Rakesh Jha';

this.emailComposer.open({
  app: 'gmail',
  to: '[e-mail]',
  cc: ['[e-mail]', '[e-mail]'],
  bcc: ['[e-mail]', '[e-mail]'],
  body: 'Hi Team,'+'<br\><br\> Please find the Employee Name'+'<br\><br\>' + this.strEmpName+'<br\><br\>'+'Thanks & Regards'+'<br\>'+'Rakesh Jha';
  isHtml: true,
});

Hope this work is for you.