javascript - 如何在不导致 InProg 错误的情况下将 AngularJS 模板呈现为字符串？

Question

我正在尝试编写一个将给定模板和范围呈现为字符串的服务。

这是代码:

utilModule.factory('CompilerService', ['$compile', '$templateCache',
    function ($compile, $templateCache) {
        return {
            renderTemplateToString: function(templateName, scope) {
                var template = $templateCache.get(templateName);
                var linkFn = $compile(template);
                var linkedContent = linkFn(scope);
                scope.$apply();

                return linkedContent.html();
            }
        }
    }]);

然而，当我调用它时，我得到了由调用 $apply() 引起的 Angular InProg 错误:

https://docs.angularjs.org/error/$rootScope/inprog

我正在调用 $apply() 以便在检索 html 之前在模板中替换变量。

关于如何在没有 InProg 错误的情况下实现这一目标的任何想法？

Answer 1

你有两个选择:

if ( !scope.$$phase )
    scope.$apply();

这是检查代码是否在 $digest 周期内执行。

但是，$timeout 是首选:

$timeout( function(){
  var template = $templateCache.get(templateName);
                var linkFn = $compile(template);
                var linkedContent = linkFn(scope);
}, 0)

编辑:为了使用场所，你应该做这样的事情:

    renderTemplateToString: function(templateName, scope) {
            var deferred = $q.defer();
            $timeout(function(){
               var template = $templateCache.get(templateName);
               var linkFn = $compile(template);
               var linkedContent = linkFn(scope);
               scope.$apply();
               deferred.resolve( linkedContent.html() );
            }, 0);

            return deferred.promise;
    }

$timeout 正在等待 $digest 在执行前完成