How to execute ng-repeat inside <head> tag
I want to do ng-repeat on <head>
pages to list open chart meta tags. However, I am not sure how to do this, since apparently the tags allowed in <head>
contain tags.
If I just add the wrapper <div>
, as I often do with ng-repeat, browsers remove it from <head>
down to <body>
.
I thought about creating my own do-nothing statement to allow me to do something like this
<custom-repeat-wrapper ng-repeat="entry in entries"> <meta property="entry.key" content="entry.content"/> </custom-repeat-wrapper>
I guess this will work, but as far as I know, browsers can raise it to as well <body>
.
I suppose I could potentially write my own directive that sorta works like an ng-repeat, but does not require a wrapper and instead duplicates the tag it is placed on.
Does anyone have any other suggestions for a cleaner solution before I go down this path?
source share
You need to declare your angular app in html tag and use ng-repeat inside the meta tag, for example:
<html ng-app="myApp"> <head ng-controller="headController"> <meta ng-repeat="entry in entries" property ="{{entry.key}}" content="{{entry.content}}"> </head> </html>
And the controller:
angular.module('myApp', []) .controller('headController', function($scope) { $scope.entries = [{ key: 'key1', content: 'content1' }, { key: 'key2', content: 'content2' }, ]; })
Here is a working plunkr:
source share