Search code examples
grailsangularjssitemesh

grails/sitemesh layout set attribute (ng-app) in html child element


I have a couple pages that share a layout. I am adding some new pages that are going to be using angular. I am trying to find out how to set it up the template so in the child pages I can add to the html elements attribute a ng-app='xyz'.

e.g.

_layout.gsp

<html lang="en"  >

would love to just do child.gsp -

<html ng-app='angularApp'>
<meta name="layout" content="layout">

But obv, that doesn't work. Is there any easy way to achieve this ?

Is there a way to use the content pattern? I tried...

//child.gsp
<meta name="angularApp" content="angularApp"/>

//layout.gsp
<html lang="en" <%  meta(name: 'angularApp')? "ng-app='${meta(name: 'angularApp')}'":"" %> >

But it just results in nothing...


Solution

  • In _layout.gsp that is being used by your view:

    <html lang="en" ${pageProperty(name:'page.ngapp')} > ...... </html>
    

    Then you will be able to alter the value in subsequent gsp views that use previous layout:

    <content tag="ngapp">ng-app='angularApp'</content>
    

    EDIT: In newer version of grails that I was using (2.4.4) I had to specify the attribute - value combination without quotes:

    <content tag="ngapp">ng-app=angularApp</content>
    

    Finally the rendered view will have whatever you wanted there to be:

    <html lang="en" ng-app="angularApp" > ..... </html>