Angular 5 app doesn't render in safari mobile browser
up vote
0
down vote
favorite
Hi I have a simple angular 5 application that uploads an image to my web server. This angular 5 app works perfectly in chrome(mobile/desktop) and only Safari desktop version. but when I access it from my iPhone using Safari as a web browser, it does not render.....to be able to work I have to enable JS:
When I make this configuration in IOS the web application works without problems...then my question is....what can I do so that my angular web app be rendered in mobile safari, without having to make this configuration in IOS?
Angular Code:
HTML
<div class="custom-file">
<input type="file" class="custom-file-input" lang="es" (change)="onFileChange($event)">
<label class="custom-file-label" for="customFileLang">{{fileName}}</label>
</div>
TS
export class AppComponent{
title = 'app';
fileName:string;
base64:string;
constructor(private imageService: ImageService) {
}
onFileChange(event) {
let image:File = event.target.files[0];
this.base64=image.name;
this.imageService.saveImage(image).subscribe();
}
Many thanks!
javascript angular typescript
asked Nov 21 at 23:30
AlejoDev
312216
add a comment |
up vote
0
down vote
favorite
Hi I have a simple angular 5 application that uploads an image to my web server. This angular 5 app works perfectly in chrome(mobile/desktop) and only Safari desktop version. but when I access it from my iPhone using Safari as a web browser, it does not render.....to be able to work I have to enable JS:
When I make this configuration in IOS the web application works without problems...then my question is....what can I do so that my angular web app be rendered in mobile safari, without having to make this configuration in IOS?
Angular Code:
HTML
<div class="custom-file">
<input type="file" class="custom-file-input" lang="es" (change)="onFileChange($event)">
<label class="custom-file-label" for="customFileLang">{{fileName}}</label>
</div>
TS
export class AppComponent{
title = 'app';
fileName:string;
base64:string;
constructor(private imageService: ImageService) {
}
onFileChange(event) {
let image:File = event.target.files[0];
this.base64=image.name;
this.imageService.saveImage(image).subscribe();
}
Many thanks!
javascript angular typescript
asked Nov 21 at 23:30
AlejoDev
312216
1
Can you clarify what you mean? I seems you are saying that Safari on iOS has JS disabled, but you expect a JS application to work anyway. It seems the answer is to enable JS in Safari iOS. What am I missing?
– Randy Casburn
Nov 21 at 23:33
The problem is that this option is disabled by default in IOS, then every user who wants to use my application must enable javascript. This is something that can cause my application not to be used, because they may think it does not work, so the idea is to prevent each user from having to do this ... how could he do it?
– AlejoDev
Nov 21 at 23:41
show a message in case of js not being enabled saying they have to enable it?
– toskv
Nov 21 at 23:45
How could I do something like that?
– AlejoDev
Nov 21 at 23:50
1
w3schools.com/tags/tag_noscript.asp
– toskv
Nov 22 at 0:06
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
Hi I have a simple angular 5 application that uploads an image to my web server. This angular 5 app works perfectly in chrome(mobile/desktop) and only Safari desktop version. but when I access it from my iPhone using Safari as a web browser, it does not render.....to be able to work I have to enable JS:
When I make this configuration in IOS the web application works without problems...then my question is....what can I do so that my angular web app be rendered in mobile safari, without having to make this configuration in IOS?
Angular Code:
HTML
<div class="custom-file">
<input type="file" class="custom-file-input" lang="es" (change)="onFileChange($event)">
<label class="custom-file-label" for="customFileLang">{{fileName}}</label>
</div>
TS
export class AppComponent{
title = 'app';
fileName:string;
base64:string;
constructor(private imageService: ImageService) {
}
onFileChange(event) {
let image:File = event.target.files[0];
this.base64=image.name;
this.imageService.saveImage(image).subscribe();
}
Many thanks!
javascript angular typescript
asked Nov 21 at 23:30
AlejoDev
312216
Hi I have a simple angular 5 application that uploads an image to my web server. This angular 5 app works perfectly in chrome(mobile/desktop) and only Safari desktop version. but when I access it from my iPhone using Safari as a web browser, it does not render.....to be able to work I have to enable JS:
When I make this configuration in IOS the web application works without problems...then my question is....what can I do so that my angular web app be rendered in mobile safari, without having to make this configuration in IOS?
Angular Code:
HTML
<div class="custom-file">
<input type="file" class="custom-file-input" lang="es" (change)="onFileChange($event)">
<label class="custom-file-label" for="customFileLang">{{fileName}}</label>
</div>
TS
export class AppComponent{
title = 'app';
fileName:string;
base64:string;
constructor(private imageService: ImageService) {
}
onFileChange(event) {
let image:File = event.target.files[0];
this.base64=image.name;
this.imageService.saveImage(image).subscribe();
}
Many thanks!
javascript angular typescript
javascript angular typescript
asked Nov 21 at 23:30
AlejoDev
312216
asked Nov 21 at 23:30
AlejoDev
312216
edited Nov 21 at 23:35
asked Nov 21 at 23:30
AlejoDev
312216
asked Nov 21 at 23:30
AlejoDev
312216
asked Nov 21 at 23:30
AlejoDev
312216
312216
1
Can you clarify what you mean? I seems you are saying that Safari on iOS has JS disabled, but you expect a JS application to work anyway. It seems the answer is to enable JS in Safari iOS. What am I missing?
– Randy Casburn
Nov 21 at 23:33
The problem is that this option is disabled by default in IOS, then every user who wants to use my application must enable javascript. This is something that can cause my application not to be used, because they may think it does not work, so the idea is to prevent each user from having to do this ... how could he do it?
– AlejoDev
Nov 21 at 23:41
show a message in case of js not being enabled saying they have to enable it?
– toskv
Nov 21 at 23:45
How could I do something like that?
– AlejoDev
Nov 21 at 23:50
1
w3schools.com/tags/tag_noscript.asp
– toskv
Nov 22 at 0:06
add a comment |
1
Can you clarify what you mean? I seems you are saying that Safari on iOS has JS disabled, but you expect a JS application to work anyway. It seems the answer is to enable JS in Safari iOS. What am I missing?
– Randy Casburn
Nov 21 at 23:33
The problem is that this option is disabled by default in IOS, then every user who wants to use my application must enable javascript. This is something that can cause my application not to be used, because they may think it does not work, so the idea is to prevent each user from having to do this ... how could he do it?
– AlejoDev
Nov 21 at 23:41
show a message in case of js not being enabled saying they have to enable it?
– toskv
Nov 21 at 23:45
How could I do something like that?
– AlejoDev
Nov 21 at 23:50
1
w3schools.com/tags/tag_noscript.asp
– toskv
Nov 22 at 0:06
1
1
Can you clarify what you mean? I seems you are saying that Safari on iOS has JS disabled, but you expect a JS application to work anyway. It seems the answer is to enable JS in Safari iOS. What am I missing?
– Randy Casburn
Nov 21 at 23:33
Can you clarify what you mean? I seems you are saying that Safari on iOS has JS disabled, but you expect a JS application to work anyway. It seems the answer is to enable JS in Safari iOS. What am I missing?
– Randy Casburn
Nov 21 at 23:33
The problem is that this option is disabled by default in IOS, then every user who wants to use my application must enable javascript. This is something that can cause my application not to be used, because they may think it does not work, so the idea is to prevent each user from having to do this ... how could he do it?
– AlejoDev
Nov 21 at 23:41
The problem is that this option is disabled by default in IOS, then every user who wants to use my application must enable javascript. This is something that can cause my application not to be used, because they may think it does not work, so the idea is to prevent each user from having to do this ... how could he do it?
– AlejoDev
Nov 21 at 23:41
show a message in case of js not being enabled saying they have to enable it?
– toskv
Nov 21 at 23:45
show a message in case of js not being enabled saying they have to enable it?
– toskv
Nov 21 at 23:45
How could I do something like that?
– AlejoDev
Nov 21 at 23:50
How could I do something like that?
– AlejoDev
Nov 21 at 23:50
1
1
w3schools.com/tags/tag_noscript.asp
– toskv
Nov 22 at 0:06
w3schools.com/tags/tag_noscript.asp
– toskv
Nov 22 at 0:06
add a comment |
2 Answers
2
active
oldest
votes
up vote
0
down vote
An Angular app (in Typescript) is transpiled in Javascript, so it will not work until JavaScript is enabled.
It looks like the default value of this setting is "enabled" so don't worry about your visitors.
answered Nov 21 at 23:34
Maarti
1,2742721
add a comment |
up vote
0
down vote
The problem is with the IOS version (11.4.1) that I have, because when you've never manipulated it, the button looks like it's disabled, but it's actually active ... but when you manipulate it, it actually shows the status button ... that is, active or inactive...which means that JS is active by default in IOS, but it is shown as inactive
See more details
answered Nov 22 at 0:08
AlejoDev
312216
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53421900%2fangular-5-app-doesnt-render-in-safari-mobile-browser%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
An Angular app (in Typescript) is transpiled in Javascript, so it will not work until JavaScript is enabled.
It looks like the default value of this setting is "enabled" so don't worry about your visitors.
answered Nov 21 at 23:34
Maarti
1,2742721
add a comment |
up vote
0
down vote
An Angular app (in Typescript) is transpiled in Javascript, so it will not work until JavaScript is enabled.
It looks like the default value of this setting is "enabled" so don't worry about your visitors.
answered Nov 21 at 23:34
Maarti
1,2742721
add a comment |
up vote
0
down vote
up vote
0
down vote
An Angular app (in Typescript) is transpiled in Javascript, so it will not work until JavaScript is enabled.
It looks like the default value of this setting is "enabled" so don't worry about your visitors.
answered Nov 21 at 23:34
Maarti
1,2742721
An Angular app (in Typescript) is transpiled in Javascript, so it will not work until JavaScript is enabled.
It looks like the default value of this setting is "enabled" so don't worry about your visitors.
answered Nov 21 at 23:34
Maarti
1,2742721
edited Nov 21 at 23:56
answered Nov 21 at 23:34
Maarti
1,2742721
answered Nov 21 at 23:34
Maarti
1,2742721
answered Nov 21 at 23:34
Maarti
1,2742721
1,2742721
add a comment |
add a comment |
up vote
0
down vote
The problem is with the IOS version (11.4.1) that I have, because when you've never manipulated it, the button looks like it's disabled, but it's actually active ... but when you manipulate it, it actually shows the status button ... that is, active or inactive...which means that JS is active by default in IOS, but it is shown as inactive
See more details
answered Nov 22 at 0:08
AlejoDev
312216
add a comment |
up vote
0
down vote
The problem is with the IOS version (11.4.1) that I have, because when you've never manipulated it, the button looks like it's disabled, but it's actually active ... but when you manipulate it, it actually shows the status button ... that is, active or inactive...which means that JS is active by default in IOS, but it is shown as inactive
See more details
answered Nov 22 at 0:08
AlejoDev
312216
add a comment |
up vote
0
down vote
up vote
0
down vote
The problem is with the IOS version (11.4.1) that I have, because when you've never manipulated it, the button looks like it's disabled, but it's actually active ... but when you manipulate it, it actually shows the status button ... that is, active or inactive...which means that JS is active by default in IOS, but it is shown as inactive
See more details
answered Nov 22 at 0:08
AlejoDev
312216
The problem is with the IOS version (11.4.1) that I have, because when you've never manipulated it, the button looks like it's disabled, but it's actually active ... but when you manipulate it, it actually shows the status button ... that is, active or inactive...which means that JS is active by default in IOS, but it is shown as inactive
See more details
answered Nov 22 at 0:08
AlejoDev
312216
answered Nov 22 at 0:08
AlejoDev
312216
answered Nov 22 at 0:08
AlejoDev
312216
answered Nov 22 at 0:08
AlejoDev
312216
312216
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53421900%2fangular-5-app-doesnt-render-in-safari-mobile-browser%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Can you clarify what you mean? I seems you are saying that Safari on iOS has JS disabled, but you expect a JS application to work anyway. It seems the answer is to enable JS in Safari iOS. What am I missing?
– Randy Casburn
Nov 21 at 23:33
The problem is that this option is disabled by default in IOS, then every user who wants to use my application must enable javascript. This is something that can cause my application not to be used, because they may think it does not work, so the idea is to prevent each user from having to do this ... how could he do it?
– AlejoDev
Nov 21 at 23:41
show a message in case of js not being enabled saying they have to enable it?
– toskv
Nov 21 at 23:45
How could I do something like that?
– AlejoDev
Nov 21 at 23:50
1
w3schools.com/tags/tag_noscript.asp
– toskv
Nov 22 at 0:06