Javascript vaadin:使用自定义布局集成angular js

Javascript vaadin:使用自定义布局集成angular js,javascript,java,angularjs,vaadin,Javascript,Java,Angularjs,Vaadin,我尝试使用如下自定义布局将angular js应用程序集成到vaadin中: VerticalLayout mainLayout = new VerticalLayout(); mainLayout.setMargin(true); mainLayout.setWidth("1380px"); setCompositionRoot(mainLayout); Panel panel = new Panel(); CustomLayout layout =

我尝试使用如下自定义布局将angular js应用程序集成到vaadin中:

VerticalLayout mainLayout = new VerticalLayout();
    mainLayout.setMargin(true);
    mainLayout.setWidth("1380px");
    setCompositionRoot(mainLayout);
    Panel panel = new Panel();

    CustomLayout layout = null;
    try {
         String dynamicHtml = "<div ng-app=\"app\">..........</div>";
         layout = 
      new CustomLayout(new   ByteArrayInputStream(dynamicHtml.getBytes()));
    } catch (IOException e) {
        logger.error("could not create custom layaout", e);
    }
 panel.setContent(layout);
 mainLayout.addComponent(panel);
importJs();

public void importJs() {
String PATH_TO_JS_SCRIPT = jsURL+"?tata=" + new Date();
String script = "try{var fileref=document.createElement('script');";
script += "fileref.setAttribute(\"type\",\"text/javascript\");";
script += "fileref.setAttribute(\"src\", \"" + PATH_TO_JS_SCRIPT + 
    "\");";
script += "document.getElementsByTagName(\"head 
\")[0].appendChild(fileref);}catch(e){alert(e);}";
Page.getCurrent().getJavaScript().execute(script);
}
VerticalLayout mainLayout=新建VerticalLayout();
mainLayout.setMargin(真);
主布局。设置宽度(“1380px”);
setCompositionRoot(主布局);
面板=新面板();
CustomLayout=null;
试一试{
字符串dynamicHtml=“……”;
布局=
新的CustomLayout(新的ByteArrayInputStream(dynamicHtml.getBytes());
}捕获(IOE异常){
logger.error(“无法创建自定义layaout”,e);
}
面板。设置内容(布局);
主布局。添加组件(面板);
importJs();
public void importJs(){
字符串PATH_TO_JS_SCRIPT=jsURL+“?tata=“+new Date();
String script=“try{var fileref=document.createElement('script');”;
script+=“fileref.setAttribute(\“type\”,\“text/javascript\”);”;
script+=“fileref.setAttribute(\“src\”,\”“+PATH\u TO\u JS\u script+
"\");";
script+=“document.getElementsByTagName(\”头
\”[0]。appendChild(fileref);}catch(e){alert(e);}”;
Page.getCurrent().getJavaScript().execute(脚本);
}
我使用importJs方法导入脚本js。 当我第一次访问页面时,js文件被加载并正常工作。 第二次不起作用。 就像没有导入脚本一样。 我看不出我的代码有什么问题? 使用Javascript注释我也有同样的问题。 我用 瓦丁7.6.5
java 7在CustomLayout中插入角度代码是个坏主意

我建议您阅读以下文字:


有一个附加组件可以让您结合Vaadin和AngularJS的优点:

在CustomLayout中插入角度代码是个坏主意

我建议您阅读以下文字:


有一个附加组件可以让您结合Vaadin和AngularJS的优点:

在页面的生命周期中,Js文件只包含一次。 要在每次显示我使用的页面时执行此脚本,请执行以下操作:

  if(typeof angular != 'undefined'){
       angular.bootstrap(document.getElementById('swdId'), ['app']);"
   }

此问题已修复

Js文件仅包含一次,并且在页面生命周期中仅包含一次。 要在每次显示我使用的页面时执行此脚本,请执行以下操作:

  if(typeof angular != 'undefined'){
       angular.bootstrap(document.getElementById('swdId'), ['app']);"
   }

问题解决了

谢谢dragan的回答。我已经读到了关于Van的书。我试过了,但这取决于Java8。我使用的是java 7。无论如何,CustomLayout对您没有帮助。您还可以尝试将Angular组件集成为任何其他java脚本组件,如中所述。我也不完全确定Vaangular是否仅与java 8兼容。你确定吗?谢谢你的回答。我已经读到了关于Van的书。我试过了,但这取决于Java8。我使用的是java 7。无论如何,CustomLayout对您没有帮助。您还可以尝试将Angular组件集成为任何其他java脚本组件,如中所述。我也不完全确定Vaangular是否仅与java 8兼容。你确定吗?