SCSS-Check Empty กรณีที่ ข้อมูลใน Element ไม่มี

โจทย์ก็คือผมมีปัญหาว่าตัว Smart tableที่เอามาใช้ ไม่มี Total page และ Perpage เลยต้องทำเพิ่มตามรูป

ปัญหาเกิดขึ้นเวลาที่ข้อมูลมีแค่ Page เดียว ตัว Total Row มันขยับขึ้นด้านบน ตามรูป

##วิธีการแก้ไข

จากที่ตรวจสอบจุดที่ Pagination หายไปเจอว่า Module ของ Smart table ไปสั่ง Clear html ที่อยู่ใน <ng2-smart-table-pager เป็น Empty

<div class=”table-responsive”>
<ng2-smart-table _ngcontent-ulj-c12=”” _nghost-ulj-c14=””>
<ng2-smart-table-pager class=”ng-star-inserted”><! — →<! — →</ng2-smart-table-pager>
</ng2-smart-table>
</div>

คิดหาลากหลายวิธี สุดท้ายมาจบที่การ เช็ค Empty ตามตัวอย่างใช้ประมาณนี้

ng2-smart-table-pager:empty {
height: 50px !important;
}

**Check ว่า ถ้าไม่มี Element ใน ng2-smart-table-pager เลยให้ ใส่ความสูงเป็น 50px