Format Slides

src/app/userpage/user-dash/user-dash.page.html

@@ -7,45 +7,33 @@
 <ion-content>
   <div class="dash_top">
     <ion-grid>
-    <ion-row>
-      
-      <ion-item>
-        <ion-avatar slot="start">
-          <img alt="Silhouette of a person's head" src="https://ionicframework.com/docs/img/demos/avatar.svg" />
-        </ion-avatar>
-        <ion-label>
-          Avatar Item
-        </ion-label>
-      </ion-item>
-
-    </ion-row>
-    <ion-row>
-      <ion-col>
-        <ion-slides pager="true">
-          <ion-slide>
-            <ion-button shape="round" size="small" fill="outline" class="slide_c" outline
-              >Menu Item 11</ion-button
-            >
-          </ion-slide>
-          <ion-slide>
-            <ion-button shape="round" size="small" fill="outline" class="slide_c" outline
-              >Menu Item 22</ion-button
-            >
-          </ion-slide>
-          <ion-slide>
-            <ion-button shape="round" size="small" fill="outline" class="slide_c" outline
-              >Menu Item 33</ion-button
-            >
-          </ion-slide>
-          <ion-slide>
-            <ion-button shape="round" size="small" fill="outline" class="slide_c" outline
-              >Menu Item 44</ion-button
-            >
-          </ion-slide>
-        </ion-slides>
-      </ion-col>
-    </ion-row>
-  </ion-grid>
+      <ion-row>
+        <ion-item>
+          <ion-avatar slot="start">
+            <img
+              alt="Silhouette of a person's head"
+              src="https://ionicframework.com/docs/img/demos/avatar.svg"
+            />
+          </ion-avatar>
+          <ion-label> Avatar Item </ion-label>
+        </ion-item>
+      </ion-row>
+      <ion-row>
+        <ion-col>
+          <ion-slides pager="true">
+            <ion-slide *ngFor="let x of slides_items; let i = index">
+              <ion-button
+                shape="round"
+                size="small"
+                fill="outline"
+                class="slide_c"
+                outline
+                >{{x.name}}</ion-button
+              >
+            </ion-slide>
+          </ion-slides>
+        </ion-col>
+      </ion-row>
+    </ion-grid>
   </div>
-  
 </ion-content>

src/app/userpage/user-dash/user-dash.page.ts

@@ -8,7 +8,16 @@ import { Component, OnInit } from '@angular/core';
 export class UserDashPage implements OnInit {
 
   constructor() { }
-
+  slides_items = [
+    {menu_key: "thisleadto", name: "This Menu 11", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 22", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 33", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 44", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 55", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 66", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 77", extra: "c"},
+    {menu_key: "thisleadto", name: "This Menu 88", extra: "c"}
+    ]
   ngOnInit() {
   }