How can I place text inside an ion-toggle

Question

Current I have a ion-toggle that looks like this

I want to do this

Is there anyway to make this happen? I read somewhere I could use ng-true-value and ng-false-value but that doesnt seem to do what I am looking for

Answer 1

I found a better solution...

<ion-toggle></ion-toggle>

use the css code:

ion-toggle[aria-checked="false"]{
   position: relative;
   width: 70px;
  &::before {
    position: absolute;
    content: "BACK";
    font-size: 10px;
    line-height: 31px;
  }
  &::after {
    position: absolute;
    content: "";
  }
 }
 ion-toggle[aria-checked="true"]{
  position: relative;
  width: 70px;
  &::before {
    position: absolute;
    content: "";
  }
 &::after {
   position: absolute;
   content: "FRONT";
   font-size: 10px;
   line-height: 31px;
   top: 0;
   left: 3px;
   color: #fff;
 }
}