CODEWITHSUNDEEP
javascripthtmljsonangularjs
jamesdeath123
jamesdeath123

Reputation: 4606

unable to display chinese char on my static website with javascript and json

I have 2 jsons:

cn.json:

{
"id_contactus": "联系我们"
}

and another: en.json:

{
"id_contactus": "Contact Us"
}

I have angular-js to pick one json file to read depending on user input:

HomeControllers.controller('HomeLanCtrl', function($scope, $http) {
$http.get($lan.concat(".json")).success(function(data) {
    $scope.text = data;
});
});

Eventually, my html looks like:

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body ng-controller="HomeLanCtrl">
    <li class="header_list_end"><a href="contactus.html">{{text.id_contactus}}</a></li>
</body>

If I use en, which means loading the en.json, the webpage shows correctly; however if I pick cn, which to load the cn.json, then the webpage shows 

��ϵ����

instead of the correct characters. The thing is, in html if I don't use the javascript but use the chinese char directly:

    <li class="header_list_end"><a href="contactus.html">联系我们</a></li>

This will work...

Any comments on why it won't work is highly appreciated!!!!

Upvotes: 0

Views: 1081

Answers (1)

Thomas Dutrion
Thomas Dutrion

Reputation: 1893

I would say that your problem comes from your json file encoding. What editor are you using to create your file? Can you make sure it is encoded in UTF8?

There is already existing discussion concerning the data binding and the encoding, but I'm no expert in Angular yet so I can't tell whether it is relevant. Use ng-bind-html. It is definitely not usable as it is, as you are not using the binding as they do, but there might be a way to make your binding understand the HTML structure instead of plain text.

Upvotes: 1

Related Questions