web-dev-qa-db-ja.com

JSONファイルの翻訳を整理するツール

Angular app。これまでのところ、 angular-translate はさまざまな翻訳ツールを調査しています。言語ごとのJSONファイルを使用していますこれらは「lang/NAMESPACE/LANG.json」のように構造化されており(たとえば、「lang/user/de.json」)、次のようになります。

{
  "key1": "Value1",
  "key2": "Value2",
  "key3": "Value3",  
}

オプションで、JSONをネストすることもできます。

これは使いやすいようです。ただし、実際に新しい翻訳を追加したり、既存の翻訳を変更したりする場合は、少し不便です。異なる言語ファイルを前後に変更する必要があり、特定のキーの翻訳を見つけるのは面倒です。異なる翻訳を比較することも不便です。

local翻訳ファイルを読み取ることができ、キーごとに異なる翻訳を並べて表示できるツールはありますか?アプリケーション(Mac OSのサポートは必須)またはブラウザベースのいずれかです。

12
str

私は(まだ)試していませんが、これはうまくいくかもしれません: https://github.com/jcbvm/i18n-editor

Javaで書かれているため、(おそらく)Macでも動作します。

9
beat

私自身も同じものが必要だったので、次のように書きました。

私は既存の言語で2つのドロップダウンを持っていました。

両方の言語を選択すると、jsonファイルが配列に読み込まれ、双方向バインディングを使用してng-repeatで表示されたため、入力フィールドの内容が変更されると、配列が即座に更新されました。

次に、applyメソッドは、ファイル名と配列をドキュメントに書き込んだphpファイルにアップロードしました。

eng.json:

{
  "ALBUM":{
    "TITEL":"album",
    "LAAD_MEER":"Load more",
    "ALBUMS":"Back to albums"
  },
  "INFO":{
    "TITEL":"information",
    "HOTELS":"Hotels",
    "SPORTHAL":"Sportscenter",
    "INTHISHOTEL":"In this facility"
  }
}

私のhtml:

<section ng-if="toSelected"
         class="bg-g-r bg-u-1 card flyin"
         ng-repeat="section in fromContents"
         id="{{'trans'+section.TITEL}}"
         class="translatorSection">

    <p class="paddedText bg-u-1 blueElement">{{section.TITEL}}</p>
    <div class="textContainer bg-u-1"
         ng-repeat="line in section">
        <p style="color:grey">{{line}}</p>
        <textarea class="bg-u-1" ng-model="toContents[getKeys(toContents,$parent.$index)][getKeys(section,$index)]"
                style="padding: 8px;border-radius: 10px"
                ></textarea>
    </div>
</section>

私のコントローラー:

//Bound to the dropdowns in my case
$scope.fromSelected = null; //language from wich to start
$scope.toSelected = null; //language i wish to extend

$scope.fromContents = null;
$scope.toContents = null;

$scope.$watch('fromSelected', function (abbr) {
    if(abbr) {
        jsonFactory.getLanguageContents(abbr).then(function (data) {
            $scope.fromContents = data.data;
        });
    }
});
$scope.$watch('toSelected', function (abbr) {
    if(abbr) {
        jsonFactory.getLanguageContents(abbr).then(function(data){
            $scope.toContents = data.data;
        });
    }
});

$scope.getKeys = function (array,index){
    return Object.keys(array)[index];
};

$scope.getToValueByKey = function (key){
    return $scope.toContents[key];
};

$scope.apply = function (){            
    jsonFactory.UploadLanguage($scope.toSelected,$scope.toContents)
        .then(function(data){
            alert('update succesfull, please reload')
        });
};

Jsonfactory:

    function getLanguageContents(lang) {
        var deferred = $q.defer(),
            httpPromise = $http.get('languages/'+lang+'.json');

        httpPromise.then(function (response) {
            deferred.resolve(response);
        }, function (error) {
            console.error(error);
        });

        return deferred.promise;
    }   

    function UploadLanguage(lang,content){
            return $q(function(resolve,reject){
                var xmlhttp,
                    params = 'lang='+lang+'&content='+JSON.stringify(content);

                if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp = new XMLHttpRequest();
                }
                else { // code for IE6, IE5
                    xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
                }

                xmlhttp.open('POST', 'http://localhost:63342/website/app/php/translator.php', true);
                xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                xmlhttp.onreadystatechange = function() {
                    if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
                        var data = xmlhttp.responseText;
                        resolve(data);
                    }else if (xmlhttp.readyState === 4){
                        reject('not found');
                    }
                };
                xmlhttp.send(params);
            });
        }

JavaScriptでjsonファイルを含むフォルダーをいくつかの配列に読み取ります。各配列について、入力フィールドを使用してng-repeatを作成するだけで、キーとすべての翻訳が表示されます。変更を加えると、配列と言語を送信するボタンが作成されますこのphpスクリプトのファイル名:(私は一度に1つの言語しか受け入れません)

<?php
  header("Access-Control-Allow-Origin: *");
  $taal = $_POST["lang"];
  $content = $_POST["content"];
  $myfile = fopen("../languages/".$taal.".json", "w");
  fwrite($myfile, $content);
  fclose($myfile);
  echo $taal;
  echo $content;
?>

実際に作成するのは非常に簡単でした。自分のサイトに追加したかったので、誰もが翻訳を手伝うことができましたが、そこに到達することはありませんでした。

私はすべてのコードを与えることはできませんが、これであなたが始めることができると思います。

Result in webpage

0
Yakke