我对AngularJS相对较新,而我遇到的问题之一是“我想将一个服务注入app.config”类型的场景,我意识到这是无法完成的。 (我对Service和Provider之间的差异感到满意,以及为什么不能将服务注入到.config中。)
我要完成的是将angular-schema-form与angular-translate一起使用,以便翻译生成的表单中的字段标题。
有一个issue where someone asks how to do this,给出的建议是利用angular-schema-form的postProcess
,这是Provider的一个属性。此回调在呈现之前为您提供表单对象,使您有机会使用用户代码对其进行操作。因此,翻译可以在这里完成。
在Provider上调用postProcess
方法,因此它在app.config中完成:
app.config(function(schemaFormProvider, $translateProvider) {
schemaFormProvider.postProcess(function(form){
// within here I can inspect the form object, find all
// properties whose key is "title", and then perform
// language translation on their values.
所以,这显然是我有机会操纵控制权等的地方。
对于angular-translate库,为了“手动”翻译字符串,我可以使用$translate
服务。这提供了同步和异步方法来转换给定的键字符串。同步的是$translate.instant(key)
。
要将这两者粘合在一起,到目前为止我尝试过的(确实有效)是创建一个像这样的“桥接”方法:
var app = angular.module('myApplicationName', ['schemaForm', 'pascalprecht.translate']);
....
app.config(function(schemaFormProvider, $translateProvider) {
schemaFormProvider.postProcess(function(form){
// ... code here which iterates over properties
// and finds all control titles ...
key = app.myTranslate(key);
// ....
}
....
});
app.myTranslate = function (key) {
var service = angular.injector(['ng', 'myApplicationName']).get("$translate");
return service.instant(key);
}
这确实有效,但它似乎很丑陋且不安全(因为可能在首次调用回调时无法保证$translate
已准备就绪)并且对angular.injector(['ng', 'myApplicationName']).get...
的调用可能很昂贵。
考虑到我正在使用的库的限制,是否有更好的方法,或者这是我要完成它的唯一方法?
我还考虑了一种替代方法,即在由angular-schema-form处理之前,在架构或表单对象上执行转换。这可以在控制器内完成,消除了访问$translate
服务的问题。我可能最终会沿着这条路走下去,但了解上述情况的最佳解决方案仍然会很好。