Unable to get my html after EJS to display when the file is rendered-CodePudding

Hello Im not the best when it comes to using ejs so apologies if this is a stupid question. Im having a really difficult time figuring out why the html after my EJS data is not displaying, once I start my server. Im not sure if missing something after the ejs or if im completly using it incorrectly, Any help would be much appreciated.

Below you can find my code

 <!-- Movie Section -->
        <section >
            <div >
                <h1 >POPULAR</h1>
            </div>
            <div >

                <% movieData.items.forEach(movie=> {%>
                    <div >
                        <div >
                            <span >
                                <%=movie.imDbRating%><i ></i>
                            </span>
                            <div >
                                <img src=<%=movie.image%> alt=<%=movie.fullTitle%>>
                            </div>
                            <div >
                                <h5 >
                                    <%=movie.title%>
                                </h5>
                                <div >
                                    <div >
                                        <span><span >
                                                <%=movie.year%>
                                            </span>.<span >127 min</span></span>
                                    </div>
                                    <div >
                                        <span>Movie</span>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                    <%})%>
                        <!-- Movie Info Overlay -->

                        <section >
                            <div >
                                <div >
                                    <a href="#" >OFFICIAL PAGE</a>
                                    <button >
                                        <i ></i>
                                    </button>
                                </div>
                                <div >
                                    <div >
                                        <img src="https://image.tmdb.org/t/p/w500/AeyiuQUUs78bPkz18FY3AzNFF8b.jpg"
                                            alt="movie-poster">
                                    </div>
                                    <div >
                                        <h2 >Fullmetal Alchemist: The Final Alchemy</h2>
                                        <h4 >Release date: 2022-06-24</h4>
                                        <div >
                                            <span>rating: 6.3 <i ></i></span>
                                            <span >all votes: 109</span>
                                        </div>
                                        <div >Action</div>
                                        <div >
                                            <h4>Plot: The Elric brothers' long and winding journey comes to a close in
                                                this epic finale,
                                                where they must face off against an unworldly, nationwide threat.</h4>
                                        </div>
                                    </div>
                                </div>

                                <div >
                                    <div ></div>
                                    <h3 >Trailer:</h3>
                                    <iframe src="https://www.youtube.com/embed/cqj4u6eyDq8" title="YouTube video player"
                                        frameborder="0"
                                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                                        allowfullscreen></iframe>

CodePudding user response：

Ended up using a partial to fill in the rest of the information and this worked out for me, I'm not sure if this is the best practice but this was all that I was finding as a solution.

CodePudding user response：

I see the code is not full. if your header and footer is in other file then add this to this file.. <%- include("header") -%> // it should contain content upper part.

<%- include("footer") -%> // it should contain content lower part.

if your code in partials then follow this one:

<%- include("partials/header") -%> // it should contain content upper part.

<%- include("partials/footer") -%> // it should contain content lower part.