I have my angular 4+ webapp which have a different header on different routes.All the components loads through angular code hence, everything is javascript and there is not much HTML except root component.Due to this, the google is not able to crawl any links.The SEO has taken a hit. I want to know whether if I add my header and footer HTML piece of code and mark it as hidden by default will google and other social sites be able to crawl my page.
I know we can use Angular Universal and use server-side rendering, but for a temporary fix is the above solution workable? Also, apart from extra bytes of transfer from server to the client is there any downside to it?
This question is not duplicate as it refers to angular 2+ version.Most of the answers are of angularjs.