Ionic-framework: [4.0.0-rc.0] ion-button ignores target attribute

Created on 20 Dec 2018  路  5Comments  路  Source: ionic-team/ionic-framework

Bug Report

Ionic version:
[x] 4.x

Current behavior:
When using ion-button with href and target attributes, <a> tag is created but is missing target attribute.

Expected behavior:
targetattribute should be passed to the <a> element inside ion-button

Steps to reproduce:

<ion-button href="/assets/files/FILE.pdf" target="_blank">
    <ion-icon slot="start" name="cloud-download"></ion-icon>
    OPEN IN NEW TAB
</ion-button>

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.6.0 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-rc.0
   @angular-devkit/build-angular : 0.11.4
   @angular-devkit/schematics    : 7.1.4
   @angular/cli                  : 7.1.4
   @ionic/angular-toolkit        : 1.2.1

System:

   NodeJS : v11.5.0 (/usr/local/Cellar/node/11.5.0/bin/node)
   npm    : 6.5.0
   OS     : macOS Mojave
core feature request

Most helpful comment

Thank you for the issue! I've merged this in via the PR here: https://github.com/ionic-team/ionic/pull/17883

The fixes for this will be in the 4.6.0 release.

All 5 comments

Same with the download attribute.

This can also be replicated in @ionic/angular 4.0.1

ion-item has the same behavior... ignores passing these attributes on to the <a> tag.

As a result, installed PWAs (web app "Add to Homescreen") won't properly use the target="_blank" attribute on ion-button or ion-item and links to sub-domains that share the same primary domain will open as-if they are part of the PWA rather than as-if they are an external link to the application.

Thank you for the issue! I've merged this in via the PR here: https://github.com/ionic-team/ionic/pull/17883

The fixes for this will be in the 4.6.0 release.

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Was this page helpful?
0 / 5 - 0 ratings