AngularJS directive - Rendering text as HTML content

I have the following directive:

    myApp.directive('testimonialCard', [function () {
    return {
        restrict: 'E',
        replace: true,
        scope: {
            linkUrl: '@',
            authorName: '@',
            authorTitle: '@',
            authorCredentials: '@',
            testimonialText: '@',
            testimonialTextClass: '@',
            visualUrl: '@',
            iconClass: '@'
        },
        controller: function () {
        },
        templateUrl: '/templates/testimonialCard.html',
        transclude: false
    };
}]);

And the following template:

<script type="text/ng-template" id="/templates/testimonialCard.html">
<a data-ng-href="{{::(linkUrl || '#') }}"
   class="testimonial-card col-xs-12 col-sm-12 col-md-8 col-lg-8 {{::css_class}}" 
   data-ng-class="::(visualUrl)) ? 'with-icon' : 'without-icon'" >
    <div class="panel panel-default">
        <div class="panel-heading">
            <div class="row testimonial">
                <div class="col-xs-12">
                    <div class="testimonial-card-summary">
                        <span class="decorative_quote">“​‌</span>
                        <div class="testimonial-card-summary-text" > {{::testimonialText}} </div>
                    </div>
                </div>
            </div>
            <div class="row author-info">
                <h4 class="name col-xs-12">{{::authorName}}<span data-ng-if="::(authorTitle)" class="academic-degree">, {{::authorTitle}}</span></h4>
                <div class="field-content credentials">{{::authorCredentials}}</div>
              <span class="testimonial-card-visual pull-right" data-ng-if="::(visualUrl || iconClass)">

                  <img data-ng-if="::visualUrl"
                       data-ng-src="{{::visualUrl}}"
                       class="testimonial-card-icon pull-right"
                       data-ng-class="::iconClass"
                  />
                  <div data-ng-if="::!visualUrl"
                       class="testimonial-card-icon"
                      data-ng-class="::iconClass"></div>

              </span>                
            </div>                
        </div>
    </div>
</a>

The end user fills out a testimonial card as such:

<testimonial-card
    link-Url="http://www.somewebaddress.com"
    author-Name="John Doe"
    author-Title="Ph.D"
    author-Credentials="Some University Creds"
    testimonial-Text="<p>Donec sollicitudin molestie malesuada.</p><p>Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.</p><p>Vivamus suscipit tortor eget felis porttitor volutpat.</p>"
    testimonial-Text-Class=""
    visual-Url="http://www.somewebaddress.com/someimage.jpg"
    icon-Class=""></testimonial-card>

As you can guess the testimonial-text is showing up as it was typed. I need to convert this to html. I've tried several different methods to convert, compile, etc. testimonial-Text to no avail. Any help is greatly appreciated!

UPDATE:

In case anyone is having the same problem...

I ended up fixing it by adding the following to my controller:

controller: function ($scope,$sce,  $log) {
              $scope.testimonialContent = $sce.trustAsHtml($scope.testimonialText);
            },

And in my template:

I changed the:

   <div class="testimonial-card-summary-text" > {{::testimonialText}} </div>

to this:

   <div class="testimonial-card-summary-text" ng-bind-html="testimonialContent"></div>

---