Question

有没有办法用实际的HTML替换控制器的$scope.test？我知道您可以将$scope.test设置为数字，字母等，但是如何将模板注入绑定？

Answer 1

您是在谈论拥有$scope.test = '{{test}}'然后进一步解析，还是在谈论$scope.test = '<div>example</div>'之类的内容。

如果它是后者，只需执行我所做的操作并将其设置为包含HTML的字符串。如果$scope.test来自某个地方（例如表单输入）并且您无法直接设置变量，则还可以创建custom filter并执行类似{{test|wrapInDiv}}的操作。< / p>

以下是一个示例过滤器：

angular.module('myapp', [])
.filter('wrapInDiv', function() {
  return function (input) {
      return '<div>' + input + '</div>';
  };
});

正如ebinmanuval所提到的，你也可以使用ng-bind-html输出HTML作为放置ng-bind-html元素的子元素。

<p ng-bind-html="test"></div>

其中test是$scope.test变量。

Answer 2

使用ng-bin-html自定义trust过滤器将html绑定到dom

<span ng-bind-html="test |trust"></span>

.filter('trust', [
    '$sce',
    function($sce) {
      return function(value, type) {
        return $sce.trustAsHtml(value);
      }
    }
  ]);

结帐https://jsfiddle.net/ebinmanuval/0tLso4vg/

用DOM“<div> example </div>”替换{{test}}？

2 个答案: