vendor-app/src/app/admin/malls/malls.component.html

<section class="common_card">
    <div class="card_header">
        <h4>Malls</h4>
        <div>
            <input type="text" placeholder="Search Malls" [(ngModel)]="searchTerm" (input)="searchAllMalls()"
                autocomplete="off" #searchbar>
            <button class="rect-button" (click)='showModal = true'>+</button>
        </div>
    </div>
    <div class="card_upfold">
        <li *ngFor='let malls of allMalls' class="mallList">
            <img src="{{malls.image_url}}">
            <div class="upfold-content">
                <h5> {{malls.mall_name}}</h5>
                <p>{{malls.description}}</p>
                {{showModal}}

                <div>
                    <span *ngIf='malls.outlet.length > 0'>Outlets: {{malls.outlet.length}}</span>
                    <span *ngIf='malls.outlet.length === 0'>Outlets: 0</span>
                    <span> Rating: {{malls.rating}} </span>
                    <span> Location: {{malls.mall_address}}</span>
                </div>

            </div>
        </li>
    </div>

    <div class="popUp" *ngIf='showModal === true'>
        <div class="popup-box">
            <ul class="input-list">
                <li>
                    <label> Advertisement</label>
                    <input type="number">
                </li>
                <li>
                    <label> Add Mall </label>
                    <input type="number">
                </li>
                <li>
                    <label> Add Mall </label>
                    <input type="number">
                </li>
                <li>
                    <label> Add Mall </label>
                    <input type="number">
                </li>
                <li>
                    <label> Add Mall </label>
                    <input type="number">
                </li>
                <li>
                    <label> Add Mall </label>
                    <input type="number">
                </li>
            </ul>

            <div class="action-buttons">
                <button class="rect-button cancel" (click)="showModal = false">Cancel</button>
                <button class="rect-button" (click)="addMall()">Add</button>
            </div>
        </div>
    </div>
</section>