javascript - js拼接的html代码中的angularjs部分怎样解析？

Question

使用layPage分页后，在js文件中拼接html代码，代码里用了angular，但是到前台显示时解析不了，该怎样解决？(部分代码如下 )

$scope.jobList = re.data;
                
var nums = 3;  // 每页出现的数量
var pages = Math.ceil(re.data.length/nums);  // 得到总页数

var thisDate = function(curr){
                    var str = '<ul class="listpos" ng-repeat="job in jobList">', last = curr*nums - 1;
                    last = last >= re.data.length ? (re.data.length-1) : last;
                    for(var i = (curr*nums - nums); i <= last; i++){
                        
                        str += 
                        '<li class="listitem">'+
                        '<p class="clearfix jobtil">'+
                            '<a id="{{job}}" ng-click="doJobInfo()" target="_blank" href="">{{job.jobTitle}}</a>'+
                        '</p>'+

代码拼接完在前台显示时，{{job.jobTitle}}解析不出，，而是在页面直接显示{{job.jobTitle}}，怎么破？？

Answer 1

我只给建议，推荐使用权json交互，可以把分页部分定义成 Directives

Answer 2

可以查一下Angularjs的文档,有个东西叫$compile..

Answer 3

使用指令 directive 和 template 封装一下，格式如下：

var app = angular.module("app", [])
    .directive("hello", function () {
        var option = {
            restrict: "AECM",
            template: "<ul class="listpos" ng-repeat="job in jobList">",
            replace: true,
            transclude: true
        };
        return option;
    })
    

页面用法：
<hello>test</hello>

Answer 4

<p class="invoice-notes" data-ng-bind-html="news.content"></p>
或许你值得拥有，data-ng-bind-html 取消对HTML片段转义，当然你需要将值设定为安全值
$scope.news.content = $sce.trustAsHtml($scope.news.content);

Answer 5

为了安全考虑p里不能直接绑定html.
解决方法同楼上,
ng-bind-html="news.content"
控制器里引入$sce,
$scope.news.content = $sce.trustAsHtml($scope.news.content);

Answer 6

$scehttp://docs.angularjs.cn/api/ng/service/...