Question

我正在尝试将html代码作为参数传递给angular指令。这可能吗？

这是html中的指令。在指令中，<br><br>以纯文本形式出现。

<mbs-are-you-sure body-text="'You are exporting to: ' + environmentsPretty + '.<br><br> You will replace all books.'"></mbs-are-you-sure>

这是指令：

.directive('mbsAreYouSure', [function() {
    return {
        restrict: 'E',
        scope: {
            bodyText: '='
        },
        templateUrl: 'directive-templates/are-you-sure.html'
    };
}]);

模板：

<div>{{bodyText}}</div>

Answer 1

您可以修改指令以绑定到html并使用$ sce来转换＆＃34;转换＆＃34;纯文本到html（它更像是信任问题lol）。

这是一个带有工作示例的plunkr： http://plnkr.co/edit/AB95oCiC3yzJTwkeVeUm

.directive('mbsAreYouSure', [
  function() {
    return {
      restrict: 'E',
      scope: {
        bodyText: '='
      },
      template: '<div>Plain Text:<br/> {{bodyText}}</div><br/>Converted: <p ng-bind-html="teste"></p>',
      controller: function($scope, $sce) {

        $scope.$watch('bodyText', function(value) {
          $scope.teste = $sce.trustAsHtml(value);
        })

      }
    };
  }
]);

可能有其他方法可以做到这一点，也许更优雅，但这是我能做到的最快的。

希望有所帮助，谢谢。

在Angular Directive参数中使用HTML

1 个答案: