I am using electron with angular 5. Trying to open each router link as a new tab but I am not finding anything that could help me to achieve this. Is it possible to achieve?
Have you tried adding target="_blank" to you tag? You could also try a click navigation function as well.
<a routerlink="someUrl" target="_blank">
or
<a routerlink="someUrl" (onClick)="navigate(someUrl)">
public navigate(url: string):void {
window.open(url);
}
Related
I have a web application in Angular, which is also converted (correct me if I call it the wrong way) to IOS app and I can open it in testflight app. My links which redirect to outer pages in new tabs are not working. Emails too. I have been trying to open app in a simulator but the console doesn't show any problems. My buttons simply don't work, but only on this app. When I open app on my iPhone in safari it works fine. Have you any idea what's going wrong?
As I mentioned, I tried using the simulator to find a possible error in the console. However, nothing of the sort occurs.
An example of my button implementation:
<a [href]="item?.link"target="_blank"class="no-text-decoration">
<app-custom button[color]="CustomButtonColor.Dark"
[id]="'{{item?.name}}Button'"
[type]="CustomButtonType.ButtonExpanded">
{{ 'profile.legalItems.read'| translate }}
</app-custom-button>
</a>
One solution to this issue would be to remove the target="_blank" attribute and use the window.open() function to open the links in a new tab. Here is an example of how you can modify your code to achieve this:
<app-custom-button (click)="openLink(item?.link)" [color]="CustomButtonColor.Dark" [id]="'{{item?.name}}Button'" [type]="CustomButtonType.ButtonExpanded"> {{ 'profile.legalItems.read'| translate }} </app-custom-button>
openLink(url: string) {
window.open(url, '_blank');
}
Alternatively, you can also try using the window.open() function with the target parameter set to '_blank'.
<a [href]="item?.link" (click)="openLink(item?.link)" class="no-text-decoration"> <app-custom-button [color]="CustomButtonColor.Dark" [id]="'{{item?.name}}Button'" [type]="CustomButtonType.ButtonExpanded"> {{ 'profile.legalItems.read'| translate }} </app-custom-button> </a>
openLink(url: string) {
window.open(url, '_blank');
return false;
}
I am new to Angular. I am starting with ver. 2.
I need to link to a file://... URL.
I tried normal href:
Note: app is a model object of the web which deals with applications.
<a target="_blank" href="file://{{app.outputPath}}/index.html">no link here</a>.
That doesn't work - the link is there, with correct URL, but Angular seems to block the event somehow. Why?
So I've seen ng-href but that's for Angular 1.x. And there's no *ngHref from what I can tell. So this was just a naive try:
<a target="_blank" *ngHref="file://{{app.outputPath}}/index.html">over a directive</a>.
Also I have seen something with routing but that appears to be intended only for internal links within the application:
<a [router-link]="['/staticReport', {path: app.outputPath}]">see the report</a>.
app.component.ts:
#RouteConfig([
...
{path:"/staticReport/:path", redirectTo: 'file:// ???? ' }
])
What's the way to create an external link?
I assume app is assigned async. You can work around this using the Elvis operator:
<a target="_blank" href="file://{{app?.outputPath}}/index.html">no link here</a>.
to not break the binding when Angular tries to resolve it before app actually has a value.
Original
This worked for example:
#Component({
selector: 'my-app',
template: `
<h2>Hello {{name}}</h2>
<a target="_blank" [href]="'file://' + outputPath + '/index.html'">no link here</a>
`
})
export class App {
outputPath:string = 'www.google.com';
constructor() {
this.name = 'Angular2';
}
}
Plunker
Actually, your first example works fine as well
<a target="_blank" href="file://{{outputPath}}/index.html">no link here</a>
Plunker
I have a Jquery pop-up that contains a form, and the submit button disabled. The button is supposed to get enabled once all fields have been filled. I ran a javascript script for this. However, it didn't work, and the page got refreshed. I added another button just to test the enabling.
<'button id="submitButton" disabled='true' data-theme="b" data-icon="check">Done<'/button'>
<'button id="x" onclick="enableButton()"'>Enable<'/button'>
The script:
function enableButton()
{
document.getElementById("submitButton").disabled=false;
}
This didn't work. I tried scripting it according to the jquery plugin guidelines like so:
$("#x").onclick(function()
{
$("#submitButton").button('enable');
});
This didn't work either. Any idea why? Again, this form is in a jquery pop-up.
Try:
$("#submitButton").removeAttr('disabled');
In your click event
You can try this;
$("#submitButton").removeClass('ui-disabled');
I want to use Thickbox in my site.
I have the following code:
<img src='#Url.Action("GetSchemaImage", "Hall", new {folderName = #Model.FolderName })'/>
This is generated markup:
<a class="thickbox" href="/Hall/GetSchemaImage?folderName=marineclub"><img src="/Hall/GetSchemaImage?folderName=marineclub"></a>
The image shows correctly, but when I click on it, it opens in the current window.
How to resolve it?
Thanks
try another signature for the HTML ActionLink helper and see if this works
#Html.ActionLink("GetSchemaImage", "Hall",new {folderName = #Model.FolderName },new{})
I am developing the application using jQuery Mobile 4.1.
In my app, I have two html pages like login.html and home.html. In the home.html have 3 pages. () like menupage, searchpage, resultpage.
The project flow is login.html ---> home.html. In home.html, menupage is displayed as a first page. If I choose the some option in the menupage it will move to searchpage and then resultpage. consider, currently I am in the resultpage. If I press the back button on the mobile browsers (iPhone-safari, Android-chrome) then it moves to the login.html.
But I want to display the searchPage. How to solve this one? is it possible to do this?
[Note : The pages should be in the single html page(home.html).
use the attribute data-rel="back" on the anchor tag instead of the hash navigation, this will take you to the previous page
Look at back linking: Here
Newer versions of JQuery mobile API (I guess its newer than 1.5) require adding 'back' button explicitly in header or bottom of each page.
So, try adding this in your page div tags:
data-add-back-btn="true"
data-back-btn-text="Back"
Example:
<div data-role="page" id="page2" data-add-back-btn="true" data-back-btn-text="Back">
try
$(document).ready(function(){
$('mybutton').click(function(){
parent.history.back();
return false;
});
});
or
$(document).ready(function(){
$('mybutton').click(function(){
parent.history.back();
});
});
You can try this script in the header of HTML code:
<script>
$.extend( $.mobile , {
ajaxEnabled: false,
hashListeningEnabled: false
});
</script>
You can use nonHistorySelectors option from jquery mobile where you do not want to track history. You can find the detailed documentation here http://jquerymobile.com/demos/1.0a4.1/#docs/api/globalconfig.html
This is for version 1.4.4
<div data-role="header" >
<h1>CHANGE HOUSE ANIMATION</h1>
Back
</div>
try to use li can be more even
<ul>
<li>back</li>
</ul>