Syntax Error: Token ':' is an unexpected token when passing variable to directive
I have a directive called iframely and I it inside an ng-repeat like this:
<iframely url="iterator.url"></iframely>
This just treats the value as the string "iterator.url", not the actual .url value. To experiment, I just put in a URL directly:
<iframely url="https://soundcloud.com/braxe1/braxe-one-more-chance"></iframely>
Which gives me the Syntax Error: Token ':' is an unexpected token error. The closest I've gotten to passing this value to the directive is:
<iframely url="'{{iterator.url}}'"></iframely> // note double and single quotes
This resolves the URL parameter of iterator, but also passes it along with the ' ' single-quotes as part of the string.
EDIT: Also tried that without the single quotes.
<iframely url="{{iterator.url}}"></iframely>
And got Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{iterator.url}}] starting at [{iterator.url}}]
What is the correct way to do this?
EDIT2: Here is the code for the directive:
angular.module( 'iframely', [])
.directive( 'iframely', [ '$http', '$sce', function ( $http, $sce ) {
return {
replace: true,
restrict: "E",
scope: {
url: '='
},
template: '<div ng-bind-html="content"></div>',
link: function ( scope, element, attrs ) {
$http( {
url: 'http://localhost:8061/iframely',
method: 'GET',
params: {
url: attrs.url
}
})
.then( function ( result ) {
scope.content = $sce.trustAsHtml( result.data.html )
})
}
}
}])
