Susequent changes to "iri" does not refresh lodlive

[mfgumban]

The following line in directive's link: angular.element($elem).lodlive({ profile: $scope.profile, firstUri: newVal, ignoreBnodes: true }); actually creates a new lodlive instance. Therefore, subsequent updates to iri after it first gets initialized result in multiple inserted lodlive divs placed on top of each other (the first instance being always on top) that gives an outward appearance of lodlive not "refreshing".

Possible solution is as follows:

$scope.$watch('iri', function(newIri, oldIri) {
    var ll = angular.element($elem).lodlive(); // lodlive() returns null if not yet initialized
    if (!ll && $scope.profile && newIri) {
        angular.element($elem).lodlive({ profile: $scope.profile, firstUri: newIri, ignoreBnodes: true });
    }
    else if (ll && newIri) {
        ll.context.empty(); // it seems that w/o this call, init(uri) will "append" rather than reset
        ll.init(newIri);
    }
});

A workaround for projects using the current version is to use angular (1.4) decorators:

angular.module('app').decorator('mlLodliveDirective', function($delegate) {
    var directive = $delegate[0];

    // completely replace link: to fix updating of iri
    var link = function($scope, $elem, $attr) {
        // Use new $scope.$watch() code here
    };

    directive.compile = function() {
        return function(scope, elem, attr) {
            link.apply(this, arguments);
        };
    };

    return $delegate;
});