angular将字符串转成html,AngularJS：将字符串转换为带有指令的HTML模板

感谢你们两位，这对我帮助很大。

我已经相应地更改了我的方法。我不想直接在＃之间添加网址。我打电话给一个服务，让我找到链接文本和我创建的参考之间的对应关系。

我因此创建了一个参考：

referential.json

{

"lollianus_primae" : {

"link" : "lollianus",

"content" : "torvum renidens fundato pectore mansit inmobilis nec se incusare nec quemquam alium passus et tandem nec confessus nec confutatus..."

},

"nulla_suffragiorum" : {

"link" : "nullasuffragiorum",

"content" : "torvum renidens fundato pectore mansit inmobilis nec se incusare nec quemquam alium passus et tandem nec confessus nec confutatus..."

},

"exploratius" : {

"link" : "exploratius",

"content" : "torvum renidens fundato pectore mansit inmobilis nec se incusare nec quemquam alium passus et tandem nec confessus nec confutatus..."

},

}

然后创建其使得能够格式化每个文本块的指令(是一个跨度或一个链接，如果是这样，我？添加addActionToLink指令给它)。

(function() {

'use strict';

angular

.module('project')

.directive('formatText', formatText);

/** @ngInject */

function formatText($compile) {

var directive = {

restrict: 'A',

replace:true,

scope : {

texte : '='

},

link: function (scope, elem, attrs) {

if (scope.texte.indexOf('_') !== -1){

// this is a link

var link = scope.texte;

var content = scope.texte.replace('_', ' ');

elem.replaceWith($compile('' + content + "")(scope));

} else {

elem.replaceWith($compile("" + scope.texte + "")(scope));

}

}

};

return directive;

}

})();

addActionToLink指令向元素添加可能的操作。 在情况下采取行动，它发送信息到负责打开的服务和喂养弹出

(function() {

'use strict';

angular

.module('project')

.directive(addActionToLink, addActionToLink);

/** @ngInject */

function addActionToLink(dimensionsService, DefinitionService) {

var directive = {

restrict: 'A',

link: function (scope, elem, attrs) {

if (dimensionsService.estUnFormatDesktop()) {

elem.bind("mouseover", function() {

console.log(attrs);

DefinitionService.recupereReferential (attrs.id).then(function (res) {

DefinitionService.ouverturePopupEttransmissionInfosSurCetteDefinition(res.data, attrs, elem[0]);

}) ;

});

} else {

elem.bind("click", function() {

console.log(attrs);

DefinitionService.recupereReferential (attrs.id).then(function (res) { DefinitionService.ouverturePopupEttransmissionInfosSurCetteDefinition (res.data, attrs, elem[0]);

});

});

}

}

};

return directive;

}

})();

这是模板的样子：

服务检索信息和打开弹出窗口仍在建设中。 再一次，非常感谢你。我不再被困住了。