Clever Geek Handbook

How do I determine the direction of text in a view?

I need a witch directive that defines the direction text and adds a class like "rtl" or "ltr", n to assign attributes:

.rtl
{
  text-align: right;
  direction: rtl;
}
.ltr
{
  text-align: left;
  direction: ltr;
}


how can i check text alignment?

+3


source to share


2 answers


When working on the text of the element in question, filters are usually more useful than directives: 

app.filter('direction', function () {
  return function (text) {
    var rtlRegex = new RegExp('[\u0591-\u07FF\uFB1D-\uFDFD\uFE70-\uFEFC]+');
    var textalign = ( rtlRegex.test(text) ) ? 'rtl': 'ltr';
    return textalign;
  }
});

in view 



<p ng-class="(item.text | direction)">{{item.text}}</p>

And in CSS define:

.rtl {
    direction: rtl;
}

.ltr {
    direction: ltr;
}
+4


source


Add class / direction to body element and then add it to your css file:

body.ltr .text-alignment {
  text-align: left !important;
}
body.rtl .text-alignment {
  text-align: right !important;
}

body.ltr .text-opposite-alignment {
  text-align: right !important;
}
body.rtl .text-opposite-alignment {
  text-align: left !important;
}


so that you add alignment of the class text whenever you need to align something :)

we use it in our project and it works like a charm

0


source






More articles:


All Articles