Ionic app fails to redirect using inappbrowser

Hey everyone, I'm currently using Ionic and working with InAppBrowser from the controller $window. However, I'm facing some issues and could really use some help on how to solve them. Here is the code that I'm working with:

Controller

 var options = {
      location: 'yes',
      clearcache: 'yes',
      toolbar: 'no'
    }

    // Code for URL redirection
    $scope.urlredirect = function (url) {
      alert(url)
      $window.open(url, '_blank', options);

HTML

 <div class="card"  ng-click=urlredirect('https://www.google.co.in/?gfe_rd=cr&ei=-K-iWb3mO-HH8gfMkpQo') >
            <div class="item item-text-wrap" >

            </div>
        </div>

Answer №1

Consider swapping $window with window:

window.open(url, '_blank', 'location=yes');

Answer №2

Have you considered utilizing the Cordova plugin for in-app browsing? It offers numerous customizable options that could potentially solve many of the issues you are facing with your browser plugin. You can find more information about the plugin here

cordova.ThemeableBrowser.open('http://apache.org', '_blank', { ... backButton: { wwwImage: 'images/back.png', wwwImagePressed: 'images/back_pressed.png', wwwImageDensity: 2, align: 'left', event: 'backPressed' } ... });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

JavaScript form validation does not function properly in Laravel 10.x

I implemented a custom validation in Laravel 10.x blade using JavaScript and Bootstrap 5 classes. However, upon clicking the submit button, the store action fails to work, resulting in the form being reloaded empty without saving any data into the database ...

The functionality of the Angular directive ngIf is not meeting the desired outcome

We are currently working on transferring data from one component to another using the approach outlined below. We want to display an error message when there is no data available. <div *ngIf="showGlobalError"> <h6>The reporting project d ...

Modifying webpack settings for a create-react-app based project: A step-by-step guide

After starting a new react project with create-react-app, I am looking to update the webpack configuration. However, I cannot seem to locate the webpack file. Should I be creating this file myself, or is there another process involved? As someone who is ...

Generating a collection of nested objects from an array of non-nested objects

If I were to present an array like the one below: [ { 'id':48, 'parent':0, 'order':1 }, { 'id':49, 'parent':48, 'order':2 }, { &ap ...

Move the camera in Three.js along a path between two vectors

I created a basic scene and came across a tutorial at to help me move the camera: var timer = new Date().getTime() * 0.0005; camera.position.x = Math.floor(Math.cos( timer ) * 200); camera.position.z = Math.floor(Math.sin( timer ) * 200); However, I n ...

Issue with hasClass and addClass not working as expected

Why isn't the script below adding a class (.active) to .global-header when .navigation.primary has a class of .active? JS if($(".navigation.primary").hasClass("active")) { $('.global-header').addClass('active'); } HTML < ...

Ways to attach JQuery UI Sortable widget to html content fetched through Ajax requests?

Here's a straightforward question for you. Take a look at my JavaScript/jQuery code snippet below: $('body .combo-table').sortable({ handle: '.grabber', opacity: 0.9, axis: 'y', start: function (e, ui) { ...

How can I populate a form in Meteor with data from a MongoDB collection that was previously inserted?

Recently, I completed constructing a lengthy form field where users can enter a plethora of information. This form consists of various text and number fields, radio button sets, and checkbox groups. The data is successfully saved in a Mongo collection with ...

Unable to create a universal <header> and <footer> to be displayed across all pages

After trying to separate the <header> and <footer> into external files, everything seemed to work fine in the console. However, when running the code, it ended up returning undefined. This is the HTML for the Footer: <footer id="footer ...

What is the process for manually verifying a Material UI checkbox?

I've been attempting to toggle the checkbox in componentDidUpdate by setting the "checked" attribute to true, but it doesn't seem to be working as expected. My state is managed using redux. I update the checkbox state in the "onChange()" method ...

Combining ajax requests in an angularJs service in all scenarios (when successful and when failed)

Presenting my service: app.factory('myService', function ($http, $q){ return { getItems: function (){ return $q.all([ $http.get('part1.json').then(function(result){return result}), $http.get(&apo ...

What is the best way to transfer values from an AJAX script to the rest of the Javascript code?

Currently, I am diving into the world of a django 2.0 template along with a third-party jQuery script used for tagging photos and my own JavaScript code that acts as the "glue." Despite being new to JavaScript and JQuery, I managed to make a successful aja ...

"Are you familiar with delving into the intricacies of this

I've managed to implement a directive that changes a HTML class element when you scroll past a certain point on the page. However, the code is a bit of a mystery to me as I pieced it together from various online sources. I really want to understand ho ...

Convert a string that represents a Buffer into an actual Buffer object

I am looking for a way to change a string representing a Buffer into the actual encoded string. For instance, if I start with the string var str1 = "hello,there" And then convert it into a buffer using Buffer.from() buf1 = Buffer.from(str1) <Buffer ...

Scroll to the bottom of a textarea in React by automatically shifting focus

I am having issues with appending text to a textarea and then scrolling to the bottom in order to keep the latest content within view. However, it seems that this process is causing the browser to crash or run out of memory. Can someone provide assistance ...

Exploring the performance capabilities of web applications using Visual Studio and JavaScript

Currently, I am in the process of conducting a web performance test on a webpage, and my goal is to calculate the time elapsed from when I click on a button to when the desired next page is fully rendered. The challenge lies in the fact that there is a si ...

When should abstract state mode and nesting/named views be utilized in angular UI Router?

Having trouble understanding this from the documentation: In my scenario, I am working on a large SPA with multiple "widgets" or "apps" on a page - each one having a controller, data, and template. Ideally, each of these should be considered as a view. Cu ...

How can you make an Angular directive activate only after the scope function in an ng-click handler has been executed?

Scenario I am relatively new to Angular and facing a specific challenge. The goal is to make a directive change the color and add an image to a button. However, I am struggling to get the first if condition to work in my Angular Directive. Issue The ob ...

Tips for aligning a Twitter button and a regular button side by side on a horizontal

I have two buttons - one for Twitter and the other a normal submit button. I am struggling to align them horizontally on the same line. After experimenting with various combinations of margin settings for ".buttonLine", ".twitter-share-button", and "#newQ ...

AngularJS: Issue with Directive Scope not triggering $destroy event

After extensive searching through the archives and online for a solution, I have come up empty-handed. There are plenty of suggested posts, but none of them provide the answer I am looking for. I am dealing with a complex directive that uses scope: true. ...