There was a time when I had no hope to finish my task on the edge and then your video came and you're such a savior! No other videos explained it like this.
thank you for your down-to-earth teaching style. So nice to listen to you chat about coding without the inflated ego that so many people in the tech world seem to think is requisite to being a successful programmer. I really enjoy your videos, thank you!
Another great video (and thanks for answering my question, previously). You are knocking this out of the park. I just can't understand why you're doing all this for free. Anyway, thanks again for this. You're brilliant.
Thanks David for the kind words. Actually I had started creating a udemy course on Angular, I was half way through and someone stole my computer from my car so I lost all the work . I decided that I am going to keep it free to the world . May be one day I can create udemy course.
Great component and as expected, full of necessary materiel related to "HttpService and CORS". You make complex thing simple and represented it nicely, Thanks
Somes, I am glad that it helped. I went through lot of trouble understanding it when i was learning so I thought it should be simpler than what others have been teaching.
Excellent Tutorial - in the first minute you pointed out some issues that took me a long time to even identify a while ago, that will help save ALOT OF PEOPLE ALOT OF TIME!
Good one. Useful. One question: if we have multiple HttpClient url to get or post how to handle the access control allow origin? Is it possible to pass multiple URL in the interceptor?
love you, thanks, bundle of thanks. you should know it only you're (very) public who is working with angular 5 :) even angular.io doesn't have such guides.
Hi Sir, I need help, can you please tell me how can I call an API which belongs to different domain form my localhost server, because currently, I am facing the cross-origin issue.
Hi Sir, I need your help. I got one API which is working on postman but when I have tried to call though angular code it is not working.. showing error
Thx for your response. :) I mean how do you use the response of the first http request for the second? Because they are async the might not be ready when using them. Right now I put the second request inside "complete".
Great tutorial. Thanks. Well I didn't understand the last portion of the tutorial. While giving "http post request" , its not actually getting update in the "db.json" file. Only just id increment is showing. What have to do for the getting real updation to db.json file. Anyone please give me an answer.
I have problems with the post for the sent through slim framework 3, Error say "Failed to load resource: the server responded with a status of 405 (Method Not Allowed)" sends as method "Option". I'm using Angular 6.
Hi @Techsith and thanks for this video. I really understood how to do GET and POST. THANKS. I have a question now. Let's take this code you did here. How can I print a list of "users" that are in that JSON file? I need for sure an Array, but how can I populate an Array of a json file that exist in a URL? Thanks again. Please, if someone knows the answer, I would appreciate the help :)
If they are inside a json file than you would have to navigate to the array. for example returning Obj = { users:[]} then you have to say myUsersArray = Obj.users; Does that answer your question?
Thanks, for the great tutorial. Can you help me out with an example how to post data with angular 5 and CI in localhost. I succeed to fetch data using CI model and controller, but unable to post data. Its an CORS issue I think, coz POST is always showing OPTIONS and 500 in console.
Hi. Thanks for the tutorial. I am facing the same issue while making a GET call to cross domain, i tried to add your Interception but even after that, i am facing same issue. Any suggestion would be welcome.
I might be very bad in basics but want to know why we are importing any module two times? Once in app.module.ts and again in the actual component file where we are going use. Am I missing anything
Thanks for this tutorial. I just have one question that I am getting [object Object] instead of actual response from the server. Could you please help? Thanks.
ok in my example i am getting an array back so my code is written for an array. you are getting a json object so you need to change it to use that. Go it?
Hi techsith. I have an issue. In dev environment I can send data to API. Api receives the Content-Type "application/x-www-form-urlencoded" that sends the json data to API, but, in production environment (after build) the API receives an empty json. My application is served by IIS. Do you have an idea how can I fix it? Is a web.config issue? Thanks.
techsith, thanks for your kindness in to respond. Angular is in one server, API in another with different IP and https prefix (www and api.). There is no error message, but I agree with you is a Cors Issue. I Tried to resolve it on server thru web.config (IIS) with no success. The API is in Laravel and I put CORS module there, but did'n resolve also.
hi , Had a query if you are aware - if I have a json format { Entries : [ { id:1, name: abc, class:a }] } how do I create the interface here to send out a put or post here ?!
yes, we have an API which takes this as JSON as an input for an update . The question is how to do we go about creating a model that would be in the above format ?
You mean represent this data in typscript interface? you can do something like this interface Entries { [index: number]: { id: number; name: string; class: any }; }
So far I have covered installation + setup, Creating new components, Data down Actions up and Http get/post. Please check it out. And in next few weeks, I will release , service, routes and styling,
This is really nice and helpful. it would be more better if you create components and module manually that might give better understanding of concepts. not all vedios only one would be fine.
Anurag I have created components manually in first few videos. basically, when you create a component via cli you would see what has been created in the command line so follow that. I have a video on JavaScript modules check it out.
Actually its very simple. Move the http get/post code into a service and . Inject service to which ever component you are trying to use. Look at the last few tutorials on services and observable I released.
please help me sir .. i can get data from an API using services and successfully received a response .. but i don't know how to pass the response from this service to a component .. :(
The data is valid, but data:any[], data[0] is array all strings. data[0] is the position of character array. For example: data[0] = {"1":"test"}, would be "{"
@@Techsithtube Yeah. Infact it is provided in spring framework itself, just like @RestController, @RequestMapping etc annotations. For more info on how to use it, www.baeldung.com/spring-cors
Maybe I'm missing something here. So, I add the interceptor.module.ts to the root area of my Angular5 App. I then add it to the app.module.ts file. I have a service that does CRUD operations. So, the part I'm not understanding is, where does this interceptor module fit into my angular app? Do I inject it into my component? Do I have to hard code my endpoint inside the interceptor.module file? Does anyone have a code snippet showing the whole process? Thanks for any help..
what does exactly CORS prevent you from??? I thought is will prevent you requesting your local server::: e.g when using development server (angular and laravel) all on the same machine !!!!
A user agent makes a cross-origin HTTP request when it requests a resource from a different domain, protocol, or port than the one from which the current document originated.
I believe prior to v4.3 @angular/http was used. However , not it seems the new way is @angular/common/http. which means You need to inject HttpClient in your component/service not the module. If you import HttpClientModule in your @NgModule Also pay attention that old http was injected using Http class token instead of the new HttpClient. Going forward the old http client will be deprecated. so dont use it.
one of angular 5 changes was @angular/common/http in the future @angular/http wont be supported anymore so dont use it. more changes : / Pipes /how to import observable and some changes in the Form Module and lifeSicleHooks plus rxjs and typecript versions updated.
can u please tell me search with two input fields one is drop down one is input box taking request from json and display it in list model example i need
I have defined child routes which accepts parameter from parent. I am using this parameter to make GET request data from API which return value to same object. So when I change parameters from parent, it should refresh child component with new data. I am not getting view refreshed. can you suggest what can be done to resolve this?
Parameters are received in child as expected. It is the service which is getting different data but assigning to same variable. This variable i have used in child component to iterate over tr tag.
I have posted my question on StackOverflow. stackoverflow.com/questions/48223175/child-component-is-not-updating-when-data-inside-object-is-changed/48228038#48228038
Inside services making a post request as below but the post request is not sent return this.http.post(this.rootUrl+'auth/sign_in',{ email : userName, password : password }) .map((data : any)=>{ localStorage.setItem('userToken',data.access_token); this.router.navigate(['/home']); }, (err : HttpErrorResponse)=>{ this.isLoginError = true; }); } Checked in the network also but there is no post request?
Hello sir, As we can handle Rest Api with angular with the help of Http package . Is it possible to handle Soap Api also through Angular ?? Please let me know if you have any idea
sir please check this link frameworkinfotech.com/ some effect on home page first time work perfectly but when go to any other tab and back to home tab then affect not working in angular 5 in angular 4 work perfectly. i have use in angular 4 ngOnInit() { this.loadScript('assets/js/animate/animate-function.js'); } public loadScript(url) { console.log('preparing to load...') let node = document.createElement('script'); node.src = url; node.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(node); } but this not work for angular 5 please give me solution.
I would suggest instead of loading it on ngOnInit() . What you have done is a hack and loading a js file is async process it may or may not work depending on when this file is received. Better solution is to create a utility lib with animate functions and import it to this component. Import would make sure that the file is there before using it.
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:4200' is therefore not allowed access. after adding interseptopr file in app, and included in app.module.ts please help me,
There was a time when I had no hope to finish my task on the edge and then your video came and you're such a savior!
No other videos explained it like this.
Archita, I am glad that you were able to fine what you were looking for. :)
@@Techsithtube it's sad that you didn't do the Post request example into the input area :(
thank you for your down-to-earth teaching style. So nice to listen to you chat about coding without the inflated ego that so many people in the tech world seem to think is requisite to being a successful programmer. I really enjoy your videos, thank you!
Thank you for watching. I believe that as a teacher you need to be humble.
Another great video (and thanks for answering my question, previously). You are knocking this out of the park. I just can't understand why you're doing all this for free. Anyway, thanks again for this. You're brilliant.
Thanks David for the kind words. Actually I had started creating a udemy course on Angular, I was half way through and someone stole my computer from my car so I lost all the work . I decided that I am going to keep it free to the world . May be one day I can create udemy course.
Great component and as expected, full of necessary materiel related to "HttpService and CORS". You make complex thing simple and represented it nicely, Thanks
Somes, I am glad that it helped. I went through lot of trouble understanding it when i was learning so I thought it should be simpler than what others have been teaching.
Excellent Tutorial - in the first minute you pointed out some issues that took me a long time to even identify a while ago, that will help save ALOT OF PEOPLE ALOT OF TIME!
I did suffer from the same when i started and I thought its important for people to know. Thanks for watching!
you have very pleasing way to present the topic in simple and lucid manner which made me comment .Looking forward for more in Angular God Bless!
Thank you so much...I am doing an Angular final in school and you have so helped me understand this !!Bless you!
Thanks mate, I understood your tutorials very easily...have had been following many, but this helped me a lot actually.
Hi, your online session presentation is awesome.
This was great, you have a great way of explaining things and actually showed how to do this step by step. Thanks!
Well done tutorial, very explanatory, really amazing edition cutting the unnecessary typing time. Congrats!
All your videos including the JavaScript ones are great. Thanks for the help!
Cool stuff TechSith, liked the get & Post requests
Hi techsith your tutorial is very informative plz upload full series on angular6 it's very helpful
Oh my god thank you, i tried to find about how to fix that cross-origin for a long time, only this video tutorial helped me :)
Initially i struggled a lot on CORS issue and i could not find a good solution anywhere . So i understand your frustration. I am glad I could help. :)
Jsonp is the answer for CORS..
Thank you so much for the interceptor module ! Loved the video . Cheers
Excellent. This is exactly what I was looking for. To the point!
Good one. Useful. One question: if we have multiple HttpClient url to get or post how to handle the access control allow origin? Is it possible to pass multiple URL in the interceptor?
love you, thanks, bundle of thanks. you should know it only you're (very) public who is working with angular 5 :) even angular.io doesn't have such guides.
Thanks Faisal, ANgular documentation is confusing that is why i am creating these tutorials make more sense.
Small and beautiful tutorial for a beginner
Hi Sir, I need help, can you please tell me how can I call an API which belongs to different domain form my localhost server, because currently, I am facing the cross-origin issue.
So clear and easy to understand. Nicely done ;)
Thanks for watching :)
Hi Sir, I need your help. I got one API which is working on postman but when I have tried to call though angular code it is not working.. showing error
thank you so much...today i learn new and first time ..........it possible for this tutorial.
it great teaching .....
Sir, you are a life savior.
a very good and easy to understand tutorial..ty sir..
hey man nice tutorial.. question though.. should api call not be done in a service file instead?
thank you, for such a great tutorial.. I am beginner to angular and this series is helping me lot
Thanks for watching!
Very well explained, You are awesome man!
simplified and awesome, thanks a lot
it's sad that you didn't do the Post request example into the input area :(
Nice videos.Request you to please add more questions on Angular 2
De Verdad muchas gracias mi pana, desde Venezuela. saludos!!
Venezuela
@techsith great tutorial, thanks so much. Can you explain how would basic authentication work in the same example?
Bundle of thanks for this video I was searching a lot for this please upload a tutorial about mapping
Like Map function in react?
very nice tutorial! Do you have one where you teach how to chain Observables correctly with HttpClient?
You mean chain multiple promises?
Thx for your response. :) I mean how do you use the response of the first http request for the second? Because they are async the might not be ready when using them. Right now I put the second request inside "complete".
Thank you so much, from Brazil!
Thank you so much for the videos ...
i appreciate your teaching style sir but i think you should have told about pipe operator and three functions error complete
Great tutorial. Thanks. Well I didn't understand the last portion of the tutorial. While giving "http post request" , its not actually getting update in the "db.json" file. Only just id increment is showing. What have to do for the getting real updation to db.json file. Anyone please give me an answer.
nice video, had a query ,how to send data in headers while http request, waiting to hear from you soon
I have problems with the post for the sent through slim framework 3, Error say "Failed to load resource: the server responded with a status of 405 (Method Not Allowed)" sends as method "Option". I'm using Angular 6.
Explained very well. Thanks!
This is very helpful . Thanks a lot for your effort.
Hi @Techsith and thanks for this video. I really understood how to do GET and POST. THANKS.
I have a question now. Let's take this code you did here.
How can I print a list of "users" that are in that JSON file? I need for sure an Array, but how can I populate an Array of a json file that exist in a URL?
Thanks again.
Please, if someone knows the answer, I would appreciate the help :)
If they are inside a json file than you would have to navigate to the array. for example returning Obj = { users:[]} then you have to say myUsersArray = Obj.users; Does that answer your question?
right to the point !!! Perfect explanation!
Thanks for the video! Awesome explanation!
Nice sir I have one doubt like if I write service call in service.ts how can I get data to my component using post method
You can inject the service in your component
I have service tutotial you can check it out.
Thanks, for the great tutorial. Can you help me out with an example how to post data with angular 5 and CI in localhost. I succeed to fetch data using CI model and controller, but unable to post data. Its an CORS issue I think, coz POST is always showing OPTIONS and 500 in console.
Thank you a lot!! I spended days trying to fix this problem
Thanks for watching!
Thanks man! This really helped me out!
This is very informative, Thanks for this tutorial
Thanks for watching Ram.
Hi. Thanks for the tutorial. I am facing the same issue while making a GET call to cross domain, i tried to add your Interception but even after that, i am facing same issue. Any suggestion would be welcome.
Nice videos.Request you to please add more questions on CSS html
Yes I have plan to add some more videos on CSS interview questions.
Awesome.... Very Productive tutorial..
Nice video!! it helps me a lot!
I might be very bad in basics but want to know why we are importing any module two times? Once in app.module.ts and again in the actual component file where we are going use. Am I missing anything
Thanks for this tutorial. I just have one question that I am getting [object Object] instead of actual response from the server. Could you please help? Thanks.
can you console.log it to see what it its? you can also look at the network tab to see what you are actually getting.
it's something like this"{list: {…}}
list
:
{q: "curd", sr: "28", ds: "any", start: 0, end: 25, …}
__proto__
:
Object"
after expanding"{list: {…}}
list
:
ds
:
"any"
end
:
25
group
:
""
item
:
(25) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
q
:
"curd"
sort
:
"n"
sr
:
"28"
start
:
0
total
:
231
__proto__
:
constructor
:
ƒ Object()
hasOwnProperty
:
ƒ hasOwnProperty()
isPrototypeOf
:
ƒ isPrototypeOf()
propertyIsEnumerable
:
ƒ propertyIsEnumerable()
toLocaleString
:
ƒ toLocaleString()
toString
:
ƒ ()
valueOf
:
ƒ valueOf()
__defineGetter__
:
ƒ __defineGetter__()
__defineSetter__
:
ƒ __defineSetter__()
__lookupGetter__
:
ƒ __lookupGetter__()
__lookupSetter__
:
ƒ __lookupSetter__()
get __proto__
:
ƒ __proto__()
set __proto__
:
ƒ __proto__()
__proto__
:
constructor
:
ƒ Object()
hasOwnProperty
:
ƒ hasOwnProperty()
isPrototypeOf
:
ƒ isPrototypeOf()
propertyIsEnumerable
:
ƒ propertyIsEnumerable()
toLocaleString
:
ƒ toLocaleString()
toString
:
ƒ ()
valueOf
:
ƒ valueOf()
__defineGetter__
:
ƒ __defineGetter__()
__defineSetter__
:
ƒ __defineSetter__()
__lookupGetter__
:
ƒ __lookupGetter__()
__lookupSetter__
:
ƒ __lookupSetter__()
get __proto__
:
ƒ __proto__()
set __proto__
:
ƒ __proto__()"
ok in my example i am getting an array back so my code is written for an array. you are getting a json object so you need to change it to use that. Go it?
Could you please tell me exactly what should i write if i want to display this data on page?
Hi techsith. I have an issue. In dev environment I can send data to API. Api receives the Content-Type "application/x-www-form-urlencoded" that sends the json data to API, but, in production environment (after build) the API receives an empty json. My application is served by IIS. Do you have an idea how can I fix it? Is a web.config issue? Thanks.
Where are you using the prod version? It could be CORS issue. Is there any errors?
techsith, thanks for your kindness in to respond. Angular is in one server, API in another with different IP and https prefix (www and api.). There is no error message, but I agree with you is a Cors Issue. I Tried to resolve it on server thru web.config (IIS) with no success. The API is in Laravel and I put CORS module there, but did'n resolve also.
hi , Had a query if you are aware -
if I have a json format
{ Entries : [ {
id:1,
name: abc,
class:a
}]
}
how do I create the interface here to send out a put or post here ?!
Here instead of an profile in my example, you have Entries. which means you would get yourAPI/Entries/name=abc Have you created an rest api for this?
yes, we have an API which takes this as JSON as an input for an update . The question is how to do we go about creating a model that would be in the above format ?
You mean represent this data in typscript interface? you can do something like this
interface Entries {
[index: number]: { id: number; name: string; class: any };
}
yes a TS interface, not in this format , thanks for your time anyways, have found a way :)
Do you have full angular course? i want to learn angular? so which version is suitable for me to learn ?
So far I have covered installation + setup, Creating new components, Data down Actions up and Http get/post. Please check it out. And in next few weeks, I will release , service, routes and styling,
Thanks for the wonderful video. Sir I would like to request you to make video on lazy loading.
Sir plz make a video on state management in angular 7
This is really nice and helpful.
it would be more better if you create components and module manually that might give better understanding of concepts.
not all vedios only one would be fine.
Anurag I have created components manually in first few videos. basically, when you create a component via cli you would see what has been created in the command line so follow that. I have a video on JavaScript modules check it out.
Yes, I have seen your javascript videos they are really helpful.
Great one.. Can you please create a simple tutorial that calling http get request, that passes the token in header or request body??
Very nice sir je 🎉🎉
How to pass Cookie in header of Get request? I have been searching this since days but didn't get an answer
Great tutorial .. but how can i do this using Services then pass the response to a Component ?
Actually its very simple. Move the http get/post code into a service and . Inject service to which ever component you are trying to use. Look at the last few tutorials on services and observable I released.
please help me sir .. i can get data from an API using services and successfully received a response .. but i don't know how to pass the response from this service to a component .. :(
+Warren Clarin ruclips.net/video/daxeYiv5FHk/видео.html
Hello Techsith, I don't think "Access-Control-Allow-Origin:*" is set on a client side. It is set on the server side Indeed!
It has to be done on both client and server. Depending on your security settings. your code may or may not work depending on your security settings.
I do not why this line not working in the code this.age = data[0].age; return undefined. Help!
what do you get when you console.log(data)
I think It might be something wrong with my JSON data, I used string to build JSON. \" to build JSON by add those strings.
Oh ok . Look at the network tab and copy the response. you can verify if the response if valid JSON or not.
thanks..
The data is valid, but data:any[], data[0] is array all strings. data[0] is the position of character array. For example: data[0] = {"1":"test"}, would be "{"
Very clear and nice tutorial
Me gustan muchos sus videos, gracias!!!.
Dear i have an problem when i am passing parameter in your given url
can you please help me into this
If you are using the in-house developed spring boot API, just adding @CrossOrigin to controller will solve the Cross Origin problem.
Thats awesome. is it open sourse?
@@Techsithtube Yeah. Infact it is provided in spring framework itself, just like @RestController, @RequestMapping etc annotations.
For more info on how to use it, www.baeldung.com/spring-cors
Thank you.. Keep up the good work.. 😀
Maybe I'm missing something here. So, I add the interceptor.module.ts to the root area of my Angular5 App. I then add it to the app.module.ts file. I have a service that does CRUD operations. So, the part I'm not understanding is, where does this interceptor module fit into my angular app? Do I inject it into my component? Do I have to hard code my endpoint inside the interceptor.module file? Does anyone have a code snippet showing the whole process? Thanks for any help..
what does exactly CORS prevent you from??? I thought is will prevent you requesting your local server::: e.g when using development server (angular and laravel) all on the same machine !!!!
A user agent makes a cross-origin HTTP request when it requests a resource from a different domain, protocol, or port than the one from which the current document originated.
Super helpful you got another sub
Very nice, it seems to be for deeloppement only because the content of the json file is github...
yes it is for development only.
Hello Sir, What is the difference between @angular/common/http and @angular/http ?
I believe prior to v4.3 @angular/http was used. However , not it seems the new way is @angular/common/http. which means
You need to inject HttpClient in your component/service not the module. If you import HttpClientModule in your @NgModule
Also pay attention that old http was injected using Http class token instead of the new HttpClient.
Going forward the old http client will be deprecated. so dont use it.
Thank You very much for very quick reply.
one of angular 5 changes was @angular/common/http
in the future @angular/http wont be supported anymore so dont use it.
more changes : / Pipes /how to import observable and some changes in the Form Module and lifeSicleHooks plus rxjs and typecript versions updated.
Yaniv Salman thank you bro
Sir, but applying cors on every HTTP request does not create any security issue.
awesome tutorial, thanks bro, abraços do Brasil
can u please tell me search with two input fields one is drop down one is input box taking request from json and display it in list model example i need
can you tell me little bit more about exactly what you need.
Very great... Much more helpful
I have defined child routes which accepts parameter from parent. I am using this parameter to make GET request data from API which return value to same object. So when I change parameters from parent, it should refresh child component with new data. I am not getting view refreshed. can you suggest what can be done to resolve this?
Yes it should update the data. Can you first make sure that parent is passing the data to child using console.log() first.
Parameters are received in child as expected. It is the service which is getting different data but assigning to same variable. This variable i have used in child component to iterate over tr tag.
Oh I see. Where is the code? I can take a look if its in public domain like github.
I have posted my question on StackOverflow. stackoverflow.com/questions/48223175/child-component-is-not-updating-when-data-inside-object-is-changed/48228038#48228038
Muchas gracias, desde Chile.
Gracias por ver.
Thanks for the tutorial.
is possible with relative path?... example this.http.post('php/test.php', { a: 'foo', b: 'bar', })
Sir Why we use * in angular? is there any logic behind.
can you tell me how do i use csrf token from the backend. please.
What is the name of software that you are using to make this video. Like both ur face and the screen recorder.. Kindly someone here let me know
Inside services making a post request as below but the post request is not sent
return this.http.post(this.rootUrl+'auth/sign_in',{
email : userName,
password : password
})
.map((data : any)=>{
localStorage.setItem('userToken',data.access_token);
this.router.navigate(['/home']);
},
(err : HttpErrorResponse)=>{
this.isLoginError = true;
});
}
Checked in the network also but there is no post request?
the code looks fine. Any errors?
@@Techsithtube no errors but I am doing call to the function from component to the service
Hi,I would like to know how to implement native plugins eg;camera in angular mobile app.
What platform you are using for building the mobile app?
ionic 3 ,which platform will be suitable with angular 5?
ionic 3 is sutable platform. I belive you can use Ionic Native to interface with the Cordova Camera plugin
Thanks you sir.
thank you a YOU ARE AMAZING ,it helped me a lot
good teaching thank you stranger
Hello sir,
As we can handle Rest Api with angular with the help of Http package .
Is it possible to handle Soap Api also through Angular ?? Please let me know if you have any idea
look for ngx-soap, its a package that you can use with angular .
Thankyou sir
I find few details on this which are a bit helpful..
if you can upload a video on ngx-soap soon that would be great.
Thanks a lot
Why you did not use two way binding
I have a separate video on two-way binding you can check it out on my channel. Thanks for watch it.
can u also do RSJX overview. thanks
i have one issue. animation effect not working on tab selection in angular 5 . how to resolve this issue.
sure. where did you put the CSS for tabs?
sir please check this link
frameworkinfotech.com/
some effect on home page
first time work perfectly
but when go to any other tab and back to home tab then affect not working in angular 5
in angular 4 work perfectly. i have use in angular 4
ngOnInit() {
this.loadScript('assets/js/animate/animate-function.js');
}
public loadScript(url) {
console.log('preparing to load...')
let node = document.createElement('script');
node.src = url;
node.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(node);
}
but this not work for angular 5 please give me solution.
I would suggest instead of loading it on ngOnInit() . What you have done is a hack and loading a js file is async process it may or may not work depending on when this file is received. Better solution is to create a utility lib with animate functions and import it to this component. Import would make sure that the file is there before using it.
Thanks but how to do it. should you give me example?
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:4200' is therefore not allowed access.
after adding interseptopr file in app, and included in app.module.ts
please help me,
Did you fire this out? Did it have to do with localhost?