4
How to do to the description, who is in a Array
in the controller
, is rendered to the <meta name="description" content="{{metadescription}}">
, which is in index.html, and can appear dynamically in views?
I use $routeParams; when I put: title: ':pageName'
the title
is replaced by the current route when accessing the page. I would like to do something similar to the metadescription
, making the description that’s inside the Array items
in the controller NatureCtrl
appear in views.
Controller
angular.module('tareasApp')
.controller('NatureCtrl', function ($scope, $routeParams, $sce, $location, $anchorScroll) {
$scope.pageName = $routeParams.pageName;
$scope.items =[
{
href:'/relaxing-sounds-waves',
img:'waves.jpg',
descricao:'Those Relaxing Sounds of Waves'
},
{
href:'/relaxing-ocean-sounds',
img:'ocean.jpg',
descricao:'Nature Sounds Relaxing Ocean Sounds'
}
];
});
app js.
var myApp = angular.module('tareasApp')
myApp.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
.when('/:pageName', {
templateUrl: 'views/wizard.html',
title: ':pageName',
metadescription: 'Aqui precisa ir algo que faça a ligação entre a descricao, que está no controller NatureCtrl, a metadescription que está na index.html e seja dinamicamente inserido nas views',
controller: 'NatureCtrl'
})
.otherwise({
redirectTo: '/'
});
});
// Dessa forma consigo obter os títulos das páginas baseado na route e routeParams. Como configurar a $rootScope.metadescription para obter a descrição referente a cada páginas?
myApp.run(['$location', '$rootScope', '$routeParams', function($location, $rootScope, $routeParams) {
$rootScope.$on('$routeChangeSuccess', function (event, current) {
var title = current.$$route.title;
if (title && $routeParams){
for(var PageName in $routeParams) {
title = title.replace(new RegExp(':' + PageName, 'g'), $routeParams[PageName]);
}
}
$rootScope.title = title;
$rootScope.metadescription = current.$$route.metadescription;
});
}]);
Page index.html
<!DOCTYPE html>
<html lang="pt-BR" ng-app="tareasApp">
<head>
<meta charset="utf-8">
<title ng-bind="title"></title>
<meta name="description" content="{{metadescription}}">
<base href="/">
<meta name="fragment" content="!">
</head>
<body>
Conteúdo vai aqui.....
</body>
</html>
I believe you would have to change the statement of your controller next to the tag
html
to bind themetadescription
. You even tried to do that?– Wakim
I tried with $Scope. $Parent.items only that I use other ng-repeat on the index and is giving conflict.
– Thiago Jem
What is your intention with this? Search engines don’t run Javascript, so they won’t see this dynamic Description you want to do.
– DiogoDoreto
After indexing the pages and sending the sitemap on google for developers the
title
anddescription
single pages are appearing in Google searches (Single pages are the main menu pages; on these I do not use$routeParams
) this question I asked refers to making a configuration to adapt the pages of articles, which use$routeParams
, to dynamically show thedescriptions
of each page, when accessing it. The Titles of the articles pages, which use$routeParams
, already appear, I would like to adapt themyApp.run
to thedescriptions
.– Thiago Jem
@Diogodoreto actually executes javascript content before parse: http://www.rimmkaufman.com/blog/googlebot-crawling-javascript-site-ready/03062014/
– OnoSendai