2

I would like to use strings including german characters (Ä, Ö, Ü) in attributes of a custom angularJS directive.

For example:

<my-custom-directive my-label="Lärm" />

Another example is the ui.bootstrap.tabs directive:

<tabset>
   <tab heading="Lärm"> content ... </tab>
   <tab heading="Second Heading"> content ... </tab>
</tabset>

This results in a tab with heading "L�rm". Any ideas?

Simon
  • 55
  • 1
  • 6
  • 5
    It has nothing to do with Angular or AngularUI, something is wrong with your page encoding. Demo: http://plnkr.co/edit/aLVPLm40slP61vbDJ5IL?p=preview – dfsq Jun 17 '15 at 14:23
  • See http://stackoverflow.com/questions/423693/how-can-i-properly-display-german-characters-in-html – roscioli Jun 17 '15 at 14:26

2 Answers2

3

Usually in a good editor you can change the document encoding type, the document is saved in. try to set it to iso-8859-1/utf-8 and save/upload again.

Next bet would be to change the encoding of the html-output with 

<meta http-equiv="Content-Type" content="text/html;charset=utf-8">

Umlauts often is trial & error...

cari
  • 2,251
  • 2
  • 18
  • 27
2

Use escape characters for javascript. 

<table width="100%" cellspacing="0" cellpadding="4" border="1">
<tbody><tr>
  <th>Display</th>
    <th>Friendly Code</th>
    <th>Numerical Code</th>
    <th>Description</th>
</tr>
<tr class="grey">
 <td class="codes">Ä&nbsp;</td>
 <td class="codes">&amp;Auml;</td>
 <td class="codes">&amp;#196;</td>
 <td class="codes">Capital A-umlaut</td>
</tr>
<tr>
 <td class="codes">ä&nbsp;</td>
 <td class="codes">&amp;auml;</td>
 <td class="codes">&amp;#228;</td>
 <td class="codes">Lowercase a-umlaut</td>
</tr>
<tr class="grey">
 <td>É</td>
 <td>&amp;Eacute;</td>
 <td>&amp;#201;</td>
 <td>Capital E-acute</td>
</tr>
<tr>
 <td>é</td>
 <td>&amp;eacute;</td>
 <td>&amp;#233;</td>
 <td>Lowercase E-acute</td>
</tr>
<tr class="grey">
 <td class="codes">Ö&nbsp;</td>
 <td class="codes">&amp;Ouml;</td>
 <td class="codes">&amp;#214;</td>
 <td class="codes">Capital O-umlaut</td>
</tr>
<tr>
 <td class="codes">ö&nbsp;</td>
 <td class="codes">&amp;ouml;</td>
 <td class="codes">&amp;#246;</td>
 <td class="codes">Lowercase o-umlaut</td>
</tr>
<tr class="grey">
 <td class="codes">Ü&nbsp;</td>
 <td class="codes">&amp;Uuml;</td>
 <td class="codes">&amp;#220;</td>
 <td class="codes">Capital U-umlaut</td>
</tr>
<tr>
 <td class="codes">ü&nbsp;</td>
 <td class="codes">&amp;uuml;</td>
 <td class="codes">&amp;#252;</td>
 <td class="codes">Lowercase u-umlaut</td>
</tr>
<tr class="grey">
 <td class="codes">ß</td>
 <td class="codes">&amp;szlig;</td>
 <td class="codes">&amp;#223;</td>
 <td class="codes">SZ ligature</td>
</tr>
<tr>
 <td class="codes">«</td>
 <td class="codes">&amp;laquo;</td>
 <td class="codes">&amp;#171;</td>
 <td class="codes">Left angle quotes</td>
</tr>
<tr class="grey">
 <td class="codes">»</td>
 <td class="codes">&amp;raquo;</td>
 <td class="codes">&amp;#187;</td>
 <td class="codes">Right angle quotes</td>
</tr>
<tr>
 <td class="codes">„</td>
 <td class="codes">&nbsp;</td>
 <td class="codes">&amp;#132;</td>
 <td class="codes">Left lower quotes</td>
</tr>
<tr class="grey">
 <td class="codes">“</td>
 <td class="codes">&nbsp;</td>
 <td class="codes">&amp;#147;</td>
 <td class="codes">Left quotes</td>
</tr>
<tr>
 <td class="codes">”</td>
 <td class="codes">&nbsp;</td>
 <td class="codes">&amp;#148;</td>
 <td class="codes">Right quotes</td>
</tr>
<tr class="grey">
 <td class="codes">°</td>
 <td class="codes">&nbsp;</td>
 <td class="codes">&amp;#176;</td>
 <td class="codes">Degree sign (Grad)</td>
</tr>
<tr>
 <td class="codes">€</td>
 <td class="codes">&amp;euro;</td>
 <td class="codes">&amp;#128;</td>
 <td class="codes">Euro</td>
</tr>
<tr class="grey">
 <td>£</td>
 <td>&amp;pound;</td>
 <td>&amp;#163;</td>
 <td>Pound Sterling</td>
</tr>
</tbody></table>
vivid
  • 1,115
  • 2
  • 14
  • 34