将已编译的dom转换为angularjs中的html代码

我的代码是：

app.directive("showResultAsText",['$compile',function ($compile) {
    return {
        restrict: 'A',compile: function compile(tElement,tAttrs,transclude) {
            console.log('compile');
            var watchModal = tAttrs["showResultAsText"];
            var elem = jQuery(tElement);
            var oriHtml = elem.html();
            elem.empty();
            return {
                post: function postLink(scope,iElement,iAttrs,controller) {
                    scope.$watch(function () {
                        return scope.$eval(watchModal);
                    },function (newVal) {
                        if (newVal) {
                            var s = $compile(angular.element(oriHtml))(scope);
                            console.log(s);
                            console.log(s[0]);
                            console.log(s[0].outerHTML);
                            console.log($('<div>').append(s[0]).html());
                            iElement.text(s[0].outerHTML);
                        }
                    });
                }
            }
        }
    }
}

您可以看到我使用console.log来打印s的值.在控制台中,它输出：

你可以看到console.log(s)和console.log(s [0])有很多信息,但是当我使用outerHTML时,内部按钮都缺失了.

我也尝试使用jquery：jQuery(s [0]).html(),但同样的事情发生了.

将s转换为HTML代码的正确方法是什么？