How to save CSS class to Ionic Storage on click?


#1

Hi

How I can set css class to storage on click and then how I’ll get it?

Let me explain it to you more:
When user will click on button “24” then a class “fontSize24” is added to the content and when user clicks on button “30” then class “fontSize30” is added to the content and “fontSize24” is removed. How do I can save it to storage?

Code is given below:

fonts.html

<ion-item>
      <button (click)="fontSizeOne()">24</button>
<button (click)="fontSizeTwo()">30</button>
    </ion-item>

fonts.ts

fontSizeOne(direction: string) {
    this.textEle.style.fontSize = direction;
    this.textEle.classList.add('fontSize24');
    this.textEle.classList.remove('fontSize30');
  }

fontSizeTwo(direction: string) {
    this.textEle.style.fontSize = direction;
    this.textEle.classList.remove('fontSize24');
    this.textEle.classList.add('fontSize30');
  }

Best Regards


#2

Anyone there to reply?


#3

Use ngStyle or ngClass.


#4

How I can use this in my scenario?


#5

If you look at the official docs for ngClass and ngStyle, you will see code examples.


#6

I’m beginner so it is difficult for me to understand it without any example


#7

Hello,

maybe this helps.


or

or
https://angular-2-training-book.rangle.io/handout/directives/attribute_directives.html

Best regards, anna-liebt


#8

The links being provided have the code examples you’re asking for


#9

@anna_liebt @jaydz

Yes these links help to set Classes and Styles but it doesn’t help them that how store class in Ionic Storage or localStorage.


#10

Hello,
maybe I understood you wrong.

This is how you change dynamically css with a click.
The css itselfs comes from a scss. Variables are in .ts.

Why you want store it, when every thing is written in a .scss or .ts file.?

Otherwise look to storage documentation.

Best regards, anna-liebt


#11

Actually on a user click, I’m adding a class to html content and I want to store that class in the storage.

Best Regards


#12

Any other solution for this issue?


#13

Hello,

that part I understood, what didn’t understood why you want do that.

Take a look to storage documentation or make a search in forum with keyword storage.
Or …
http://devtech.in/2017/01/local-storage-in-ionic-2/
https://www.joshmorony.com/a-simple-guide-to-saving-data-in-ionic-2/
or
Bset regards, anna-liebt


#14

Thanks! I hope this will help me to resolve the issue.