how to add accordian to ionic project

-
<ion-list>
    <div class="input1001" *ngFor="let d of diseases; let i=index" text-wrap (click)="toggleGroup(i)" [ngClass]="{active: isGroupShown(i)}">

    <ion-row style="border-radius: 5px;padding-top: 2px;box-shadow:2px 2px 2px 2px #e6e6e6">
      <ion-col size="11" style="    padding-left: 5px; font-size:12px
      ">
        {{d.title}}

      </ion-col>
      <ion-col size="1" style="text-align: right;padding-right: 10px;">
        <ion-icon name="chevron-down-outline" *ngIf="!isGroupShown(i)"></ion-icon>

        <ion-icon  name="chevron-up-outline" *ngIf="isGroupShown(i)"></ion-icon>

      </ion-col>

    </ion-row>
    <div style="height:1px;box-shadow: 1px 1px 1px 1px #F0F0F0 ">

    </div>
     
      <!-- <ion-item >
        <ion-label>
         

        </ion-label>
      



      </ion-item> -->
     
      <div  class="disc" *ngIf="isGroupShown(i)">{{d.description}}</div>
    </div>
  
     

  </ion-list>

 toggleGroup(group) {
    if (this.isGroupShown(group)) {
        this.shownGroup = null;
    } else {
        this.shownGroup = group;
    }
};
isGroupShown(group) {
    return this.shownGroup === group;
};

 diseases = [
    { title: "Lorem Ipsum is the simply dummy text of the printing?", description: "Type 1 diabetes is an autoimmune disease in which the body’s immune system attacks and destroys the beta cells in the pancreas that make insulin." },
    { title: "Lorem Ipsum is the simply dummy text of the printing?", description: "Multiple sclerosis (MS) is an autoimmune disease in which the body's immune system mistakenly attacks myelin, the fatty substance that surrounds and protects the nerve fibers in the central nervous system." },
    {title: "Lorem Ipsum is the simply dummy ?", description: "Crohn's disease and ulcerative colitis (UC), both also known as inflammatory bowel diseases (IBD), are autoimmune diseases in which the body's immune system attacks the intestines." },
    { title: "Lorem Ipsum is the simply dummy text of the printing?", description: "Systemic lupus erythematosus (lupus) is a chronic, systemic autoimmune disease which can damage any part of the body, including the heart, joints, skin, lungs, blood vessels, liver, kidneys and nervous system." },
    { title: "Lorem Ipsum is the simply dummy text of the printing?", description: "Rheumatoid arthritis (RA) is an autoimmune disease in which the body's immune system mistakenly begins to attack its own tissues, primarily the synovium, the membrane that lines the joints." }
  ];


shownGroup = null;

Comments

Post a Comment

Popular posts from this blog

Your app currently targets API level 27 and must target at least API level 28 to ensure it is built on the latest APIs optimized for security and performance. Change your app's target API level to at least 28

-
https://stackoverflow.com/questions/51466168/android-playstore-warning-your-app-currently-targets-api-level-25 ionic cordova platform rm android ionic cordova platform add android@7 . 1.4 (Or) prefer below code first, using ionic3 <preference name = "android-targetSdkVersion" value = "28" />
Read more

ionic project creation

-
ionic start myApp tabs  ionic generate page contact for services ::: ionic generate provider httpclientModule in ionic3 https://www.npmjs.com/package/ngx-http-client https://www.tutorialspoint.com/ionic/ionic_camera.htm import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; import { toPromise } from 'rxjs/operator/toPromise'; import { AlertController, MenuController, ToastController } from 'ionic-angular'; /* Generated class for the CallsProvider provider. See https://angular.io/guide/dependency-injection for more info on providers and Angular DI. */ @Injectable() export class CallsProvider { SERVER_IP=" http://209.126.98.38/EverestHome/public/api/v1/ " constructor(public http: HttpClient) { console.log('Hello CallsProvider Provider'); } post(api: string , requestData: any) { debugger; console.log(requestData); return this.http.po...
Read more

change root user in ubuntu

-
Run  sudo <command>  and type in your login password, if prompted, to run only that instance of the command as root. Next time you run another or the same command without the  sudo  prefix, you will not have root access. Run  sudo -i . This will give you an interactive root shell. Note that the  $  at the end of your prompt has changed to a  # , indicating that you have root access. From here you can run any sequence of commands as root, or run the command  exit  to leave the root shell. Use the  su  (substitute user) command to get a root shell. This is effectively the same as using  sudo -i . Note that when you use this command it will ask for the root password and not your login password. These are not the same. You may have to set or change the root password by running  sudo passwd root  first. Run  sudo -s . This gives you root access, but maintains your current SHELL. Shell specific s...
Read more