Angularjs and SEO

Question

I have a site made with Angularjs and PHP.

All content that is common between pages is only loaded once, when the user changes page only the content of the respective page is loaded (running the PHP API that returns a JSON) and the respective template.

The meta tags "Description" and "Keywords" change depending on the page, but as I am not reloading the entire page, this is a problem.

How do I do?
When changing the content of the page I make a script to change the content of the tags?
This will not be a problem when indexing the site?

Answer 1

If you are using views and routing in Angularjs, each routed page must have a controller. This way, you can use the following template to run something at the time the view is loaded completely:

/*Estou assumindo que o módulo do controller já está declarado*/
.controller('MeuController', function ($scope) {
  $scope.$on('$viewContentLoaded', function () {
    //Alterar meta tags com jQuery
  });
});

But the bigger problem is that views only change meta tags if they are loaded, so since Search Engines crawlers do not run Javascript, the changed tags will not be captured by crawlers; physical pages will be required for this, unfortunately.

After reading the text of this link, I realized that Google’s Crawler can read and run javascript, however, this javascript MUST be on the same page. In short, the link made the following tests:

1. Use of document.write() inside <script></script> in a single HTML file = Crawler read.
2. Use of document.write() in an archive .js external = Crawler not read.
3. Use of innerHTML inside <script></script> in a single HTML file = Crawler read.
4. Use of innerHTML in an archive .js external = Crawler not read.
5. Using tabs with jQuery = Crawler read, and associated all content to just one page.
6. Use of tabs with AJAX = Crawler read, but associated each tab to a own page.

Overall, the best idea is to tag <meta> what you want to be indexed, even if part of what’s in the tags is in the views, and not on the home page itself.