Including tripadvisor widget in angularjs app

Question

Hi I am new to angularjs. I want to add a tripadvisor widget to my angularjs app. The widget code is like this:

Answer 1

I tweaked the answer by drew_w a little to work with the "selfserve" review/ratings widgets TA have:

(function() {
  'use strict';

  angular
    .module('myapp')
    .directive('tripadvisor', function () {
    return {
      restrict: 'E',
      scope: {
        location: '='
      },
      link: function (scope, element, attrs) {
        element.append(angular.element('
'));
        scope.$watch("location", function (n, o) {
          if (angular.isDefined(scope.location)) {
            var script = '//www.tripadvisor.com/WidgetEmbed-selfserveprop?&nreviews=5&locationId=' + scope.location + '&rating=true&border=true';
            $.getScript(script, function() {
              if (window.taValidate) {
                  window.taValidate();
              }
            });
          }
        });
      }
    };
  });
})();

Use in your HTML:

I've tried to follow the angular style guide for this code, hence the IIFE (that funny (function() { at the start and })(); at the end). I use the "controller as" syntax, hence the 'vm.' in the HTML.

This is my first directive, so feedback/improvement tips are welcome! :-)