SORU
12 Aralık 2013, PERŞEMBE


-Translate açısal denetleyicileri için doğru kullanın

AngularJS bir uygulama i18n için angular-translate kullanıyorum.

Her uygulama görüntülemek için, özel bir kumanda var. Denetleyicileri altında, sayfa başlığı olarak gösterilecek değerini ayarlayın.

Kod

HTML

<h1>{{ pageTitle }}</h1>

JavaScript

.controller('FirstPageCtrl', ['$scope', '$filter', function ($scope, $filter) {
        $scope.pageTitle = $filter('translate')('HELLO_WORLD');
    }])

.controller('SecondPageCtrl', ['$scope', '$filter', function ($scope, $filter) {
        $scope.pageTitle = 'Second page title';
    }])

Çeviri dosyaları angular-translate-loader-url uzantısı kullanarak yükleme yapıyorum.

Sorun

İlk sayfa yük, çeviri anahtarı bu anahtarın çeviri yerine gösterilir. Çeviri Hello, World! ama HELLO_WORLD görüyorum.

Ben sayfaya gitmek için ikinci kez, her şey yolunda ve çevrilmiş halleri gösterilir.

Sorun belki de çeviri Dosyası Denetleyicisi $scope.pageTitle değer atama olduğunda henüz yüklü olduğu gerçeği ile ilgisi var sanırım.

Açıklama

<h1>{{ pageTitle | translate }}</h1> $scope.pageTitle = 'HELLO_WORLD';, kullanırken çeviri ilk andan beri mükemmel çalışıyor. Bu sorun her zaman çevirileri (örn. kullanmak istemiyorum. ikinci kumanda için sadece ham bir dize) geçmek istiyorum.

Soru

Bu sınırlama / bilinen bir sorundur? Bu nasıl çözülebilir?

CEVAP
13 Mart 2014, PERŞEMBE


Tavsiye: Denetleyici olarak tercüme değil, tercüme

Kumandanız çeviri mantığından uzak tutmak ve doğrudan iç görünüm dizeleri çevirmek için böyle tavsiye ederim:

<h1>{{ 'TITLE.HELLO_WORLD' | translate }}</h1>

Sağlanan hizmeti kullanarak

Açısal Çevirmek senin Denetleyicileri kullanabilirsiniz $translate hizmet sağlar.

Örnek $translate hizmet kullanımı olabilir:

.controller('TranslateMe', ['$scope', '$translate', function ($scope, $translate) {
    $translate('PAGE.TITLE')
        .then(function (translatedValue) {
            $scope.pageTitle = translatedValue;
        });
});

Tercüme hizmeti de bir söz, $translate.instant() kullanarak işlemek için gerek kalmadan doğrudan çeviri dizeleri için bir yöntem vardır:

.controller('TranslateMe', ['$scope', '$translate', function ($scope, $translate) {
    $scope.pageTitle = $translate.instant('TITLE.DASHBOARD'); // Assuming TITLE.DASHBOARD is defined
});

$translate.instant() kullanarak dezavantajı dil dosyası uyumsuz yükleme Eğer Henüz yüklü değil olabilir.

Sağlanan filtre kullanarak

Bu sözler bu şekilde ele almak olmadığı için tercih ettiğim bir yol. Filtre çıkışını doğrudan scope değişkeni için ayarlanabilir.

.controller('TranslateMe', ['$scope', '$filter', function ($scope, $filter) {
    var $translate = $filter('translate');

    $scope.pageTitle = $translate('TITLE.DASHBOARD'); // Assuming TITLE.DASHBOARD is defined
});

Sağlanan yönergesini kullanarak

@PascalPrecht bu müthiş kütüphane yaratıcısı olduğu, his advise (see his answer below) ile gidiyor tavsiye ve çeviriler çok zeki kolu görünüyor ki, verilen yönergeyi kullanmak istiyorum.

Direktif senkronize olmayan yürütme ilgilenir ve eğer çeviri dinamik değerler varsa radardan da çeviri kimlikleri unwatch kadar zeki.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • ChasesAndCrashes

    ChasesAndCra

    31 Temmuz 2009
  • DorkmanScott

    DorkmanScott

    14 NİSAN 2006
  • Glove and Boots

    Glove and Bo

    1 ŞUBAT 2007