Question

我想使用Angular作为模板引擎，然后我想将生成的HTML代码提供给另一个库。

我有一个模板文件template.html：

<div><h1><span data-ng-show="details.rs">{{details.rs}}</span></h1></div>

我想根据我在范围内的内容使用Angular生成最终的HTML。

例如，如果details.rs ==“嗨！” ：

<div><h1><span>Hi !</span></h1></div>

我尝试使用$ compile工具，但我只获得原始HTML。这是一个小样本：

var getTemplate = function (templateName) {
        var defer = $q.defer();
        if ($templateCache.get(templateName)) {
            defer.resolve($templateCache.get(templateName));
        } else {
            $http.get(templateName, {cache: $templateCache}).then(function (data) {
                defer.resolve(data);
            });
        }
        return defer.promise;
    };

    var prepareTemplate = function (templateName) {
        var defer = $q.defer();
        getTemplate(templateName).then(function (htmlTemplate) {
            defer.resolve($compile(htmlTemplate));
        });
        return defer.promise;
    };

    var buildMarkerPopup = function (properties) {
        var defer = $q.defer();
        prepareTemplate('views/template.html').then(function (template) {
            var scope = $scope.$new();
            scope.details = properties;
            $timeout(function () {
                var htmlElement = template(scope);
                $log.debug(htmlElement);
                defer.resolve(htmlElement);
            });
        });
        return defer.promise;
    };

有谁知道我错过了什么？

祝你好运

Answer 1

我认为你需要$interpolate

http://jsfiddle.net/HB7LU/9977/

var exp = $interpolate('<div><h1><span data-ng-show="details.rs">{{details.rs}}</span></h1></div>');
var context = {
    details: {
        rs: 'Hi!'
    }
};

var result = exp(context);
console.log(result)

如何使用Angular作为模板引擎

1 个答案: