programing

각도 변환을 사용하여 번역을 표시하는 방법은 무엇입니까?

minimums 2023. 10. 30. 20:51
반응형

각도 변환을 사용하여 번역을 표시하는 방법은 무엇입니까?

부분 로더와 결합한 각도 변환은 키만 보여주고 실제 변환은 보여주지 않습니다.모든 것을 시도해 보았지만 실수를 찾을 수가 없습니다.기록된 오류가 없습니다.

이게 내 암호입니다.

app.js

var app = angular.module('myapp', [
  'ngRoute',
  'appRoutes', 
  'pascalprecht.translate',
  'angularTranslate',
  'HomeCtrl'
]); 

angular.module('angularTranslate', ['pascalprecht.translate'])
  .config(function($translateProvider, $translatePartialLoaderProvider ) {
    $translateProvider.useLoader('$translatePartialLoader', {
      urlTemplate: '/languages/{lang}/{part}.json'
    });

  $translateProvider.preferredLanguage('nl');

});

따라서 템플릿이 /languages/{lang}/{part}json에서 로드됩니다.

홈 Ctrl.js

angular.module('HomeCtrl', []).controller('HomeController', 
  function($scope, $translate, $translatePartialLoader) {

    $translatePartialLoader.addPart('home');
    $translate.refresh();

});

Express에서 파일이 Angular로 라우팅되지 않고 실제로 반환되도록 하기 위해 다음과 같은 경로가 있습니다.

app.get('/languages/:lang/:part', function(req, res) {
 res.sendFile(req.params.lang + '/' + req.params.part, { root: '././languages' });
});

home.json

{
    "HOMETITLE" : "Geweldige Whatsapp gesprekken.",
}

본가의

{{ "HOMETITLE" || translate }}

그리고 마지막으로 저는 이 주문을 사용하여 index.html의 모든 것을 링크했습니다.

<script src="../libs/angular/angular.js"></script>
<script src="../libs/angular-route/angular-route.js"></script>
<script src="../libs/angular-resource/angular-resource.js"></script>
<script src="../libs/angular-translate/angular-translate.js"></script>
<script src="../libs/angular-translate-loader-partial/angular-translate-loader-partial.js"></script>

<script src="../js/controllers/HomeCtrl.js"></script>
<script src="../js/appRoutes.js"></script>
<script src="../js/index.js"></script>

다시 말씀 드리자면, 올바른 번역 대신 홈타이틀만 표시됩니다.어떤 도움이라도 주시면 대단히 감사하겠습니다!

교체해야 하는 각도 변환 설명서에 설명된 대로||와 함께|html 파일에서:

{{ "HOMETITLE" | translate }}

이후 json 번역을 포함한 독립 실행형 스니펫:

var app = angular.module('myapp', [
  'pascalprecht.translate',
  'angularTranslate',
]); 

angular.module('angularTranslate', ['pascalprecht.translate'])
  .config(function($translateProvider, $translatePartialLoaderProvider ) {
    $translateProvider.translations('nl', {
      "HOMETITLE" : "Geweldige Whatsapp gesprekken.",
    });
    $translateProvider.preferredLanguage('nl');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-translate/2.7.2/angular-translate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-translate-loader-partial/2.7.2/angular-translate-loader-partial.min.js"></script>
<html ng-app="myapp">
<body>
{{ "HOMETITLE" | translate }}
</body>
</html>

각 번역에 대한 제 경험으로 볼 때, 여기서 몇 가지 다른 문제가 발생할 수 있는데, 이는 당신의 환경이 이것에 요소로 작용하기 때문에 정확히 파악하기 어렵습니다. 만약 당신이 깃허브 레포를 가지고 있다면 제가 복제할 수 있다고 확신할 수 있습니다.

  1. 다른 사용자 중 한 명이 {{"HOMETITLE" | translate}}라고 말한 것처럼 번역에 형식 지정 문제가 있습니다. 다른 가능한 번역 형식 지정 방법은 여기에서 확인할 수 있습니다.부분 파일 및 외부 파일 로드와 함께 필터 변환을 사용하는 문제가 발생했습니다. 부분 로드를 사용할 경우 다음과 같은 변환 설정에 속성만 사용하는 것을 강력하게 권장합니다.

    http://angular-translate.github.io/docs/ #/가이드/05_사용- translate-

  2. 부분 파일 로더가 실행 중이며 번역을 실제로 복구하기 전에 {{"HOMEITLE" | translate}}을(를) 해결하고 있습니다.부분 로딩과 함께 기본 번역을 사용할 수 있기 때문에 해당되지 않도록 번역 공급자 구성에 기본 번역을 넣는 것을 제안합니다.일부 다른 사용자가 설명한 것처럼 간단한 것

    $translateProvider.translations('nl', {
      "HOMETITLE" : "Geweldige Whatsapp gesprekken.",
    });
    
    $translateProvider.preferredLanguage('nl');
    $translateProvider.forceAsyncReload(true);
    

translateProvider를 추가합니다.forceAsyncReload(true). 구성 끝까지 새로 고침이 강제로 수행됩니다.다만 json 파일과 번역을 약간 다르게 해서 force reload를 추가하기 전에 확인할 수 있도록 하는 것을 추천합니다.

이 문제는 자바스크립트 언어 구성체와 Angular 간의 혼동으로 인해 발생합니다.JS 템플릿 문자열 보간 식을 입력합니다.

다음과 같은 자바스크립트 표현을 생각해 봅니다.

var foo = bar || baz;

의 가치에 따라bar, 어투, 어투, 어법bar || baz둘 중 하나가 돌아올 것입니다. bar아니면baz.bar사실입니다. 반환됩니다. 그렇지 않으면(거짓일 때)baz반환됩니다.

다음과 같은 각도가 주어집니다. JS :{{ "HOMETITLE" || translate }}, 그 표현은 가치에 걸맞게 평가됩니다."HOMETITLE", 그 문자열 문자가 진실이기 때문입니다.

하지만, 그translate 필터는 다음과 같이 HTML 템플릿에 바인딩되어야 합니다.{{ "HOMETITLE" | translate }} .translate필터는 'HOMETITLE' 키를 인수로 전달하고 필요한 텍스트를 반환합니다.

언급URL : https://stackoverflow.com/questions/31730834/how-to-show-translations-using-angular-translate

반응형