Question

我有一个index.gsp页面，想要加载我的angularjs lib文件：

<head>
<meta name="layout" content="main" />
<title>Title Page</title>

<!-- here we are loading angularjs -->
<r:require module="angular" />

</head>
<r:layoutResources />
<body>
    <div ng-view>
        <div>Hello World!</div>
        <p>Nothing here {{'yet' + '!'}}</p>
        <p>1 + 2 = {{ 1 + 2 }}</p>
    </div>
</body>

但是我只得到纯HTML：

Hello World!

Nothing here {{'yet' + '!'}}

1 + 2 = {{ 1 + 2 }}

我的ApplicationResources.groovy看起来像这样：

modules = {

    'angular' {
        resource url:'js/lib/angular-1.2.8/angular.min.js'
        resource url:'js/lib/angular-1.2.8/angular-resource.min.js'
    }

}

我的文件夹结构如下：

enter image description here

当我启动我的应用程序时，我认为这是一个错误：

| Server running. Browse to http://localhost:8080/testApplication
| Application loaded in interactive mode. Type 'stop-app' to shutdown.
| Enter a script name to run. Use TAB for completion:
....[/testApplication].[gsp] Servlet.service() for servlet [gsp] in context w
ith path [/testApplication] threw exception
java.lang.RuntimeException: It looks like you are missing some calls to the r:la
youtResources tag. After rendering your page the following have not been rendere
d: [defer]
        at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)

        at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstruct
orAccessorImpl.java:57)
        at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingC
onstructorAccessorImpl.java:45)
        at java.lang.reflect.Constructor.newInstance(Constructor.java:526)
        at org.springsource.loaded.ri.ReflectiveInterceptor.jlrConstructorNewIns
tance(ReflectiveInterceptor.java:986)
        at org.codehaus.groovy.reflection.CachedConstructor.invoke(CachedConstru
ctor.java:77)
        at org.codehaus.groovy.runtime.callsite.ConstructorSite$ConstructorSiteN
oUnwrapNoCoerce.callConstructor(ConstructorSite.java:102)
        at org.codehaus.groovy.runtime.callsite.CallSiteArray.defaultCallConstru
ctor(CallSiteArray.java:57)
        at org.codehaus.groovy.runtime.callsite.AbstractCallSite.callConstructor
(AbstractCallSite.java:182)
        at org.codehaus.groovy.runtime.callsite.AbstractCallSite.callConstructor
(AbstractCallSite.java:190)
        at org.grails.plugin.resource.DevModeSanityFilter.doFilter(DevModeSanity
Filter.groovy:54)
        at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(Appl
icationFilterChain.java:243)
        at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationF
ilterChain.java:210)
        at org.codehaus.groovy.grails.web.servlet.mvc.GrailsWebRequestFilter.doF
ilterInternal(GrailsWebRequestFilter.java:69)
        at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerR
equestFilter.java:107)
        at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(Appl
icationFilterChain.java:243)
        at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationF
ilterChain.java:210)
        at org.codehaus.groovy.grails.web.filters.HiddenHttpMethodFilter.doFilte
rInternal(HiddenHttpMethodFilter.java:67)
        at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerR
equestFilter.java:107)
        at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(Appl
icationFilterChain.java:243)
        at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationF
ilterChain.java:210)
        at org.springframework.web.filter.CharacterEncodingFilter.doFilterIntern
al(CharacterEncodingFilter.java:88)
        at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerR
equestFilter.java:107)
        at org.springframework.web.filter.DelegatingFilterProxy.invokeDelegate(D
elegatingFilterProxy.java:343)
        at org.springframework.web.filter.DelegatingFilterProxy.doFilter(Delegat
ingFilterProxy.java:260)
        at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(Appl
icationFilterChain.java:243)
        at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationF
ilterChain.java:210)
        at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperV
alve.java:222)
        at org.apache.catalina.core.StandardContextValve.invoke(StandardContextV
alve.java:123)
        at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.j
ava:171)
        at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.j
ava:100)
        at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineVal
ve.java:118)
        at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.jav
a:408)
        at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp
11Processor.java:1041)
        at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(
AbstractProtocol.java:603)
        at org.apache.tomcat.util.net.JIoEndpoint$SocketProcessor.run(JIoEndpoin
t.java:310)
        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.
java:1145)
        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor
.java:615)
        at java.lang.Thread.run(Thread.java:744)

我不这么认为“没有加载angularjs”确实与这个错误有关，但我真的不知道它为什么不加载？

感谢您的回答！

更新

即使删除标记<r:layoutResources />，我也会收到同样的错误

Answer 1

您需要通过设置ngApp指令来注册角度。如果你改变了

<div ng-view>

到

<div ng-app>

你应该没事。

修改

这里是我测试并假设可以正常工作的代码。

<强> index.gsp中

<head>
  <meta name="layout" content="main" />
  <title>Title Page</title>
  <r:require module="angular" />
</head>
<body>
  <div ng-app>
    <div>Hello World!</div>
    <p>Nothing here {{'yet' + '!'}}</p>
    <p>1 + 2 = {{ 1 + 2 }}</p>
  </div>
</body>

<强> main.gsp

<!DOCTYPE html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title><g:layoutTitle default="Grails"/></title>
  <link rel="stylesheet" href="${resource(dir: 'css', file: 'main.css')}" type="text/css">
  <g:layoutHead/>
  <g:javascript library="application"/>     
  <r:layoutResources />
</head>
<body>
  <div id="grailsLogo" role="banner"><a href="http://grails.org"><img src="${resource(dir: 'images', file: 'grails_logo.png')}" alt="Grails"/></a></div>
  <g:layoutBody/>
  <div class="footer" role="contentinfo"></div>
  <div id="spinner" class="spinner" style="display:none;"><g:message code="spinner.alt" default="Loading&hellip;"/></div>
  <r:layoutResources />
</body>
</html>

<强> ApplicationResources.groovy

modules = {
  application {
    resource url: 'js/application.js'
  }

  'angular' {
    resource url: 'js/angular.js'
  }
}

<强>输出

Hello World!
Nothing here yet!
1 + 2 = 3

Answer 2

尝试在ng-app和layoutResources中使用head和body。

<head>
<meta name="layout" content="main" />
<title>Title Page</title>

<!-- here we are loading angularjs -->
<r:require module="angular" />
<r:layoutResources />
</head>

<body>
    <div ng-app>
        <div>Hello World!</div>
        <p>Nothing here {{'yet' + '!'}}</p>
        <p>1 + 2 = {{ 1 + 2 }}</p>
    </div>
    <r:layoutResources />
</body>

和ApplicationResources.groovy为

'angular' {
    resource url:'/js/lib/angular-1.2.8/angular.min.js'
    resource url:'/js/lib/angular-1.2.8/angular-resource.min.js'
}

将路径添加为/js/lib/...

在grails中加载angularjs 2.3.4

2 个答案: