Question

我将CKEditor与AngularJS结合使用以进行内联编辑（使用contenteditable）。 enter image description here

在CKeditor模糊时，$ http请求上升到服务器并更新数据库，特别是刚修改的相关字符串的翻译键/值对。

在服务器上，在DB中的字符串更新之后，触发构建系统并通过轮询数据库来重写[lang] .json（静态文件）。

如何判断angular-translate然后重新加载[lang] .json？

我看过很多关于部分重新加载的网页，但我没有找到关于静态文件重新加载的任何信息。

这是指令的作用。

.directive('frontOfficeEdit', [

    // RESTIntranet IS AN ANGULAR FACTORY COMMUNICATING WITH THE REST API

    '$rootScope',
    '$parse',
    'RESTIntranet', 
    '$translate', 
    '$filter', 
    function (
        $rootScope, 
        $parse, 
        RESTIntranet, 
        $translate,
        $filter
    ) {

    var counter = 0,
    prefix = '__ckd_';


    return {
        restrict: 'A',
        link: function (scope, element, attrs, controller) {


            // editMode IS A BOOLEAN DECLARED INTO THE DIRECTIVE'S PARENT $scope.
            scope.$watch('editMode', function(newVal, oldVal) {


                if (!newVal) // IF editMode IS SET TO FALSE (OFF)
                {
                    // REMOVE contenteditable FROM ELEMENT
                    attrs.$set('contenteditable', false);

                    // DESTROY ALL CKEDITOR INSTANCES AS SOON AS USER TURNS OFF editMode IN THE GUI. 
                    // THERE CAN BE MULTIPLE CKEDITOR INSTANCES ON THE SAME PAGE, SO, TO MAKE SURE, DESTROY ALL.
                    for(name in CKEDITOR.instances)
                    {
                        CKEDITOR.instances[name].destroy();
                    }
                    return;
                }

                else // ELSE, editMode IS SET TO TRUE (ON)
                {
                    var getter = $parse(attrs.frontOfficeEdit), 
                        setter = getter.assign;

                    attrs.$set('contenteditable', true); // inline ckeditor needs this

                    if (!attrs.id) {
                        attrs.$set('id', prefix + (++counter));
                    }



                    var options = {};

                    // ON BLUR, SAVE CKEDITOR'S CONTENT TO REMOTE DB (REST API)
                    options.on = {
                        blur: function (e) {
                            if (e.editor.checkDirty()) {
                                var ckValue = e.editor.getData();

                                // TRANSLATE IT?
                                ckValue = $filter('translate')(ckValue);

                                scope.$apply(function () {
                                    console.log('--->@{369} ckValue is going to be inserted/updated in DB through service : ');
                                    console.log(ckValue);

                                    // CB FRAMEWORK INTRANET REST API CALL
                                    RESTIntranet.saveContent(ckValue, attrs.stringid, attrs.stringname);

                                    // UPDATE THE STRING IN STRINGS (JSON)
                                    current_language = $translate.use();
                                    curlang_caps = current_language.toUpperCase();
                                    stringname = attrs.stringname;


                                    // THIS ENSURES THAT SCOPE'S OBJECT IS SET TO THE PROPER VALUE, EVEN ONCE CKEDITOR ARE DESTROYED
                                    /*
                                    ————————— BUT THEN, IF I CHANGE FROM EN TO FR, AND THEN GO BACK TO FR, THE TEXT IS AS BEFORE
                                    */
                                    setter(scope, ckValue);


                                });
                                ckValue = null;
                                e.editor.resetDirty();
                            }
                        }
                    };

                    options.extraPlugins = 'sourcedialog,find';
                    options.removePlugins = 'sourcearea';                   

                    var editorangular = CKEDITOR.inline(element[0], options); //invoke

                    scope.$watch(attrs.frontOfficeEdit, function (value) {
                        // TRANSLATE IT?
                        value = $filter('translate')(value);

                        editorangular.setData(value);
                    });

                } // - EOF - else

            }, true); // - EOF - scope.$watch('editMode', function(newVal, oldVal) {

        }
        // - EOF - link
    }
    // - EOF - return
}]);

我没有足够的javascript经验知道在哪里挂钩以及如何（对于异步内容的经验还不够）。感谢。

Answer 1

我认为你只需要做$translate.refresh()

https://github.com/angular-translate/angular-translate/blob/a2ac7000f94bcee6dd8e206cab5d7cec3527dd25/src/service/translate.js#L1584

   * @description
   * Refreshes a translation table pointed by the given langKey. If langKey is not specified,
   * the module will drop all existent translation tables and load new version of those which
   * are currently in use.
   *
   * Refresh means that the module will drop target translation table and try to load it again.
   *
   * In case there are no loaders registered the refresh() method will throw an Error.
   *
   * If the module is able to refresh translation tables refresh() method will broadcast
   * $translateRefreshStart and $translateRefreshEnd events.
   *
   * @example
   * // this will drop all currently existent translation tables and reload those which are
   * // currently in use
   * $translate.refresh();
   * // this will refresh a translation table for the en_US language
   * $translate.refresh('en_US');

当静态文件更新时，angular-translate重载静态文件？

1 个答案: