I am looking to dynamically update the href of a link asynchronously. Consider the following HTML:
<a ng-href="{{url}}" ng-click="resolveUrl()" target="_blank">click me</a>
Here is the angular controller code:
app.controller('MainCtrl', function($scope, $q) {
$scope.url = '#';
$scope.resolveUrl = function() {
async().then(function(resolvedUrl){
$scope.url = resolvedUrl;
});
}
function async() {
var deferred = $q.defer();
setTimeout(function() {
deferred.resolve('http://www.google.com');
}, 1000)
return deferred.promise;
}
});
I want the link to always redirect to google.com, even on the first click. How can I synchronize the async call or assign the url so that it resolves properly?
Update:
After a suggestion from @Konstantin Krass, I tried using window.open(). However, this cannot be done asynchronously as it may trigger popup blockers. Instead, I attempted to open a new window on click (which wouldn't be blocked) and then update the URL to google.com once the promise is resolved. Unfortunately, this method does not work on iPad due to tab communication constraints. Any alternative solutions?