How do I get connect-flash to return multiple messages, or a single message with newline characters?

蓝咒 提交于 2019-12-24 01:58:14

问题


I'm building an app using nodejs.

I created a form, and I'm working on back-end validation of user input. Basically, I have a var, "messages", and each time I encounter an input error, I append the error to messages.

var messages ="";
errors.forEach(function(msgObject) {
    console.log(msgObject.message);
    messages += msgObject.message + "\r\n";
})

(I'm also using indicative -- http://indicative.adonisjs.com/ -- for error validation. It returns an array errors)

I'm returning the errors to the user using connect-flash

req.flash("error", messages);

I'm using connect-flash https://www.npmjs.com/package/connect-flash

My problem is that connect-flash ignores newline characters. I.e, I get something like:

I would like each error message to be on a separate line. I can't seem to find a way to accomplish that. Any ideas?

Here's a simpler version of the problem: Why does req.flash("errors", "hello \n goodbye") return

hello goodbye

instead of

hello
goodbye

回答1:


Few things missing from your original post that might help you solve your own problem.

  1. What template language are you using to display the notifications? Is it escaping the newline?
  2. Should you be using HTML instead? So <br /> instead of \n.
  3. Why not use multiple req.flash in sequence to create an array of notifications?

3: See below

// Set a flash message by passing the key, followed by the value, to req.flash(). 
req.flash('info', 'Flash is back!')
req.flash('info', 'Another message!')

// Get an array of flash messages by passing the key to req.flash() 
res.render('index', { messages: req.flash('info') });

Since we have an array of messages, you can iterate over the messages array to show them individually:

{% for message in messages %}<li>{{ message }}</li>{% endfor %}



回答2:


You're right, I forgot about my ejs file, which answers my question.

I basically added HTML li instead of newline characters (to make a bulleted list of errors)

 errors.forEach(function(msgObject) {
    console.log(msgObject.message);
    messages += "<li>" + msgObject.message + "</li>";
})
if(messages != "") {
    messages = "<ul>" + messages + "</ul>"; 
}

then had this in my ejs file

<div class="container">
    <% if(error && error.length > 0) { %>
        <div class="alert alert-danger">
              <strong> <%- error %> </strong> 
        </div>
    <% } 
    if(success && success.length > 0) { %>
        <div class="alert alert-success">
              <strong> <%= success %> </strong>
        </div>
    <% } %>
</div>

I replaced <%= errors %> with <%- errors %>




回答3:


Actually even better..

EJS FILE:

    <div class="container">
      <% if(error && error.length > 0 ) { %>
        <div class="alert alert-danger">
            <% if(error.length === 1) { %>
               <strong> <%= error %> </strong>
            <% } else { %>
                <ul>
                    <% error.forEach(function(err) { %>
                        <li> <strong> <%= err %> </strong></li>
                    <% }) %>
                </ul>
            <% } %> 
        </div>
    <% } 
    if(success && success.length > 0) { %>
        <div class="alert alert-success">
              <strong> <%= success %> </strong>
        </div>
    <% } %>
</div>

.js FILE

var messages = [];
errors.forEach(function(msgObject) {
    messages.push(msgObject.message);
})
req.flash("error", messages)



回答4:


It will work like this:

<% if (hasMessages()) { %><% messages().forEach(function(msg){ %>
<% if(msg.message.length > 1) { %>
    <div class="alert fade in alert-<%- msg.type %>" data-alert="alert">
        <a class="close" data-dismiss="alert">&times;</a>            
        <% msg.message.forEach(function(innerMsg){ %>
            <%- innerMsg %> <br>
        <% }) %>    
    </div>
<% } else { %>    
    <div class="alert fade in alert-<%- msg.type %>" data-alert="alert">
        <a class="close" data-dismiss="alert">&times;</a>
        <%- msg.message %>             
    </div>
    <% } %>


来源:https://stackoverflow.com/questions/42233828/how-do-i-get-connect-flash-to-return-multiple-messages-or-a-single-message-with

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!