Quebra de linha

Front-end
#1

Tenho mensagens de retorno de erro do servidor.

Mostra as mensagens, mas não consigo quebrar a linha.

let mensagens = '';
error.error.forEach((mensagem: any) => {
     mensagens = '<p>' + mensagens + mensagem.texto + '</p>';
});
this.mensagemTela(error.error[0].type, '', mensagens, false);

Assim:

let mensagens = '';
error.error.forEach((mensagem: any) => {
     mensagens = '<li>' + mensagens + mensagem.texto + '</li>';
});
this.mensagemTela(error.error[0].type, '', mensagens, false);

Assim:

let mensagens = '';
error.error.forEach((mensagem: any) => {
     mensagens = mensagens + mensagem.texto + '<br>';
});
this.mensagemTela(error.error[0].type, '', mensagens, false);

Mas como imaginado, ele não converte as tags HTML e sim imprimi como uma string.

O que está faltando ?

#2

Supondo que a função mensagemTela() é a que coloca os elementos na tela, mostre o que ela faz. Sem essa informação fica difícil deduzir qual o problema.

Abraço.

#3

Acredito que na tela tenha que ter algo assim: <div [innerHTML]="theHtmlString"></div>

#4

@Lucas_Camara Valeu e vou testar.

#5

@TerraSkilll, o código é este.

protected incluirRegistro(novo: boolean) {
    this.servico.incluir(this.modelo).subscribe(
      (data: any) => {
        this.mensagemTela(data.mensagens[0].type, '', data.mensagens[0].texto, true);
        this.redirecionamentoAposMensagem(data, novo);
      }, (error: any) => {
        this.mensagemErro(error);
      }
    );
  }


private mensagemErro(erroServidor: any) {
    if (erroServidor.error.length === 1) {
      this.mensagemTela(erroServidor.error[0].type, '', erroServidor.error[0].texto, false);
    } else {
      let mensagens = '';
      erroServidor.error.forEach((mensagem: any) => {
        mensagens = mensagens + mensagem.texto;
      });
      this.mensagemTela(erroServidor.error[0].type, '', mensagens, false);
    }
  }