如何在聚合物元素加载到页面之前初始化国际化

Question

问

如何在聚合物元素加载到页面之前初始化国际化

爱飞扬无限_316 发布于 2023-02-13 14:42

我正在使用Dart构建一个Polymer应用程序.由于我在Polymer元素中使用Dart的国际化功能,我想在创建Polymer元素之前初始化国际化消息,并在Polymer元素中显示给定语言环境的相应消息.

如何才能做到这一点？有没有人成功使用Polymer with Internationalization？

PS.我按照这个例子来设置国际化

以下是Dart编辑器默认生成的Polymer应用程序以及我添加的代码.

messages_en.dart

library messages_en;

import 'package:intl/intl.dart';
import 'package:intl/message_lookup_by_library.dart';

final messages = new MessageLookup();

class MessageLookup extends MessageLookupByLibrary {

  get localeName => 'en';

  final messages = {
    "myMsg" : () => Intl.message("MY MESSAGE")
  };

}



messages_all.dart

library messages_all;

import'dart:async';
import 'package:intl/message_lookup_by_library.dart';
import 'package:intl/src/intl_helpers.dart';
import 'package:intl/intl.dart';
import 'messages_en.dart' as en;

MessageLookupByLibrary _findExact(localeName) {
  switch (localeName) {
    case 'en': return en.messages;
    default: return null;
  }
}

initializeMessages(localeName) {
  initializeInternalMessageLookup(() => new CompositeMessageLookup());
  messageLookup.addLocale(localeName, _findGeneratedMessagesFor);
  return new Future.value();
}

MessageLookupByLibrary _findGeneratedMessagesFor(locale) {
  var actualLocale = Intl.verifiedLocale(locale, (x) => _findExact(x) != null);
  if (actualLocale == null) return null;
  return _findExact(actualLocale);
}


clickcounter.dart

import 'package:polymer/polymer.dart';
import 'package:intl/intl.dart';
import 'dart:async';
import 'messages_all.dart';
import 'messages_en.dart' as en;

/**
 * A Polymer click counter element.
 */
@CustomTag('click-counter')
class ClickCounter extends PolymerElement {
  @published int count = 0;

  @observable var messagesLoaded = false;

  ClickCounter.created() : super.created() {
    var enMessagesFuture = initializeMessages('en');

    Future.wait([enMessagesFuture]).then((_) => messagesLoaded = true);
  }

  void increment() {
    count++;
  }
}


clickcounter.html


  
  


    
  




  
  
  

    

      

        Günter Zöchb..
         8
      
      
我得到了一些工作:

为ClickCounter添加一个getter

String get locale => Intl.getCurrentLocale();


并将HTML更改为

当前区域设置:{{locale}}

创造一个变压器

library i18n_transformer;

import 'package:polymer_expressions/filter.dart' show Transformer;
import 'package:intl/intl.dart' show Intl;

class I18nTransformer extends Transformer {
  Map _labels;
  String language;
  String missingIndicator;
  I18nTransformer(this._labels, {this.language: 'en', this.missingIndicator: '#'});

  String forward(params) {
    String id;

    if(params is String) {
      id = params;
    } else if(params is Map) {
      if(!(params['0'] is String)) {
        throw 'Error: The first list element must contain the label id as string.';
      }
      id = params['0'];
    } else {
      throw 'Error: The I18nTransformer expects either a label id as string or a list containing a label id and parameters.';
    }

    var msg = Intl.message('', name: id);
    if(msg == null || msg.isEmpty) {
      return '${missingIndicator}(${language}-${params})';
    }
  }

  dynamic reverse(String label) {
    return 'reverse not supported';
  }
}


并将以下内容添加到ClickCounter

final I18nTransformer i18n = new I18nTransformer(null, language: 'en');


并在HTML中

{{ 'myMsg' | i18n }}
{{ 'myMsg2' | i18n }}
 


评论:

你可以制作一个更简单的Transformer ,但我选择使用Transformer 

能够在表格中提供附加参数(尚未在变压器中实现)

{{ {0: 'myMsg', 1:'x'} | i18n }}


PolymerExpressions尚不支持列表文字,因此您必须添加一些虚拟键,如0,1,......

在我的实现中,第一个键必须为0才能工作,正如您在代码中看到的那样.



        
        1 个回答
        
                        
                我得到了一些工作:

为ClickCounter添加一个getter

String get locale => Intl.getCurrentLocale();


并将HTML更改为

当前区域设置:{{locale}}

创造一个变压器

library i18n_transformer;

import 'package:polymer_expressions/filter.dart' show Transformer;
import 'package:intl/intl.dart' show Intl;

class I18nTransformer extends Transformer<dynamic,String> {
  Map<String,dynamic> _labels;
  String language;
  String missingIndicator;
  I18nTransformer(this._labels, {this.language: 'en', this.missingIndicator: '#'});

  String forward(params) {
    String id;

    if(params is String) {
      id = params;
    } else if(params is Map) {
      if(!(params['0'] is String)) {
        throw 'Error: The first list element must contain the label id as string.';
      }
      id = params['0'];
    } else {
      throw 'Error: The I18nTransformer expects either a label id as string or a list containing a label id and parameters.';
    }

    var msg = Intl.message('', name: id);
    if(msg == null || msg.isEmpty) {
      return '${missingIndicator}(${language}-${params})';
    }
  }

  dynamic reverse(String label) {
    return 'reverse not supported';
  }
}


并将以下内容添加到ClickCounter

final I18nTransformer i18n = new I18nTransformer(null, language: 'en');


并在HTML中

<p>{{ 'myMsg' | i18n }}</p>
<p>{{ 'myMsg2' | i18n }}</p> <!-- sample output for a not existing message -->


评论:

你可以制作一个更简单的Transformer <String,String>,但我选择使用Transformer <dynamic,String>

能够在表格中提供附加参数(尚未在变压器中实现)

{{ {0: 'myMsg', 1:'x'} | i18n }}


PolymerExpressions尚不支持列表文字,因此您必须添加一些虚拟键,如0,1,......

在我的实现中,第一个键必须为0才能工作,正如您在代码中看到的那样.

        

                
                    2023-02-13 14:43  回答
                       小呀小-儿郎
                
            

                    

    

    
    
        撰写答案
        
            
                
                    回答问题...