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

StackOverflow https://stackoverflow.com/questions/17151165

  •  31-05-2022
  •  | 
  •  

Question

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...

Was it helpful?

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>

OTHER TIPS

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

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

The angular app will be injected in the main (parent) layout and will be available for all the children views when required. You can also use ng-view if you are interested in a single page application.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top