Angular Compatibility

2 replies · opened Jul 23, 2017

Kkk1429meJul 23, 2017

I just purchased your theme since I loved it. However, when I try to replicate your demo-travel template in angular 4. The HTML doesn't show nor do I get any errors in the console. Are your templates compatible with angular and do you have a documentation or a guide to make the template work in angular 4?

SSemicolon WebSTAFFJul 23, 2017

Hello,

Thank You so much for Purchasing Canvas and the Kind Words! :)

Unfortunately, Canvas is not directly compatible with AngularJS and you will need to make some customizations/tweaks to make it work. The issue you are facing at the moment points to a JS Issue and particularly to the SEMICOLON.initialize.pageTransition(); Function. Meanwhile, this can be fixed by simply deleting/commenting the above function in the js/functions.js File and adding the .no-transition Class to the <body> Tag.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Kkk1429meJul 23, 2017

Thanks for the info. To get better results, I divided your demo-travel into small components separating the top-bar and header-bar and so on, just to see exactly which area is not working with Angular. Also angular works with components, this way the template can be made angular-ready.

For some reason, angular has a bug where the url() doesn't work for fonts and background-image. But there is a small hack for it, simply start the path from root to assets to the destination. Now after manually changing the paths I was able to get some items working.

The top-bar and header-bar work perfectly, however, injecting the wrapper class in the div doesn't work for some reason, the whole page goes blank, so I have removed the line id="wrapper" in the div; if you know why then please lemme know. Also for some reason the background images dont' work either, I just get a black page thats all.

This is the code I am referring to which gives me the black page:


			

				
					
						
							
							
							
						
					
				

I will keep updating this section until I am able to get it up and running in angular framework. My client actually liked your template so I am trying to make it work in this framework, I hope you understand :)

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard