2017-08-04 3 views
0

thymeleafとangularjsを一緒に使うと困っています。私は角度jsとsidenavメニューにしようと私はthis tutorialに従っています。私は、リンク上で同じでしたが、thymeleafは、この例外がスローされます。thymeleafが除外ツールを投げます。

によって引き起こさ

:org.xml.sax.SAXParseException:要素のタイプ「セクション」に関連した属性名「フレックスは、」「=」が続く必要がありますキャラクター。

<!DOCTYPE html> 
 
<html ng-app="app" xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
    <meta charset="UTF-8"/> 
 
    <script type="text/javascript" 
 
      src="webjars/jquery/2.1.4/jquery.min.js"></script> 
 

 
    <link rel="stylesheet" type="text/css" 
 
      href="webjars/bootstrap/3.3.7/css/bootstrap.min.css" /> 
 

 
    <link rel="stylesheet" 
 
      href="webjars/font-awesome/4.7.0/css/font-awesome.min.css"/> 
 

 
    <script type="text/javascript" 
 
      src="webjars/angularjs/1.5.5/angular.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="webjars/angularjs/1.5.5/angular-route.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="webjars/angularjs/1.5.5/angular-resource.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="webjars/angularjs/1.5.5/angular-animate.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="webjars/angularjs/1.5.5/angular-aria.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="webjars/angular-material/1.1.0/angular-material.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="js/app.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="js/tokenInterceptorService.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="js/navigation.js"></script> 
 

 
    <script type="text/javascript" 
 
      src="js/sidenav.js"></script> 
 

 

 

 

 
    <title>Title</title> 
 
</head> 
 
<body ng-controller="navigation"> 
 
<div ng-controller="SideNavCtrl" layout="column" style="height: 500px;" data-ng-cloak=""> 
 

 
    <section layout="row" flex> 
 

 
     <md-sidenav class="md-sidenav-left" md-component-id="left" 
 
        md-disable-backdrop md-whiteframe="4"> 
 

 
      <md-toolbar class="md-theme-indigo"> 
 
       <h1 class="md-toolbar-tools">Disabled Backdrop</h1> 
 
      </md-toolbar> 
 

 
      <md-content layout-margin> 
 
       <p> 
 
        This sidenav is not showing any backdrop, where users can click on it, to close the sidenav. 
 
       </p> 
 
       <md-button ng-click="toggleLeft()" class="md-accent"> 
 
        Close this Sidenav 
 
       </md-button> 
 
      </md-content> 
 

 
     </md-sidenav> 
 

 
     <md-content flex layout-padding> 
 

 
      <div layout="column" layout-align="top center"> 
 
       <p> 
 
        Developers can also disable the backdrop of the sidenav.<br/> 
 
        This will disable the functionality to click outside to close the sidenav. 
 
       </p> 
 

 
       <div> 
 
        <md-button ng-click="toggleLeft()" class="md-raised"> 
 
         Toggle Sidenav 
 
        </md-button> 
 
       </div> 
 

 
      </div> 
 

 
     </md-content> 
 

 
    </section> 
 

 
</div> 
 
</html>

問題はどのようなものです:ここ

はhtmlですか? Theymeleafは=、flex = ".."のようなパラメータを必要としますか?

答えて

0

はい、通常は次のような属性が指定されています:flex="flex"

関連する問題