Spring ThymeleafをAngularJS routeProviderで動作させる

Question

私のアプリケーションは、バックエンドにはSpringブートを使用し、フロントエンドにはAngular JSを使用します。

私は多言語サポートのためにThymeleafを使用しています。 Thymeleafはすべてのhtmlファイルをtemplatesというフォルダの下に置く必要があります。

フロントエンドでは、angleのrouteProviderを使用してページをリダイレクトしました。ここでは、コードは次のとおりです。Java側で

angular. 
    module("myapp"). 
    config(function ($routeProvider) { 
    $routeProvider 
    .when('/dashboard/:param1/:param2/', { 
     templateUrl: 'templates/pages/dashboard.html', 
     controller: 'dashboardController', 
     reloadOnSearch: false 
    }) 
    .when('/login/', { 
     templateUrl: 'templates/auth/login.html' 
    }) 
    .otherwise({ redirectTo: '/dashboard/global/-1' }); 
}); 

、私は、ログインページ

@Configuration 
public class WebConfig extends WebMvcConfigurerAdapter { 

    @Override 
    public void addViewControllers(ViewControllerRegistry registry) { 
     super.addViewControllers(registry); 
     registry.addViewController("/login").setViewName("auth/login"); //This works 

     registry.addViewController("/dashboard/**").setViewName("page/dashboard"); //Don't work, 404 error 
     registry.setOrder(Ordered.HIGHEST_PRECEDENCE);  
    } 
} 

私WebConfig.javaにいくつかのViewControllerコードを持って動作しますが、ダッシュボードのために、角度は私に404エラーが発生します。

いいえ、私はテンプレートフォルダの外にダッシュボードを移動した場合http://localhost:8080/myapp/templates/pages/dashboard.html 404（見つかりません）

を取得し、

角度

templateUrl: 'pages/dashboard.html', 

にtemplateUrlを変更になりましたダッシュボードページを検索し、表示することができますが、Thymeleafそれはテンプレートフォルダの外にあるので、より長い動作をします。私は多言語能力を失ってしまった。

私はlogin.htmlがhead、bodyという完全なhtmlページです。 dashboard.htmlはindex.htmlの一部ですので、それは大きなdivです。

私は、Spring MVCとAngular routerProviderについて混乱します。私の場合、ANGULARJS $ routeProviderを使用することは可能ですか？私は多言語能力のためにThymeleafが必要なので、私はSpring MVCだけを使うべきですか？助言がありますか？

Answer 1

トピックをグーグル後、私はこの記事からの解決策が見つかりました：Thymeleafが動作するために、基本的に Angular simple routing is not working

を、HTMLテンプレートは、テンプレートフォルダの下に置かれなければなりません。角度テンプレートの

、あなたはHTMLテンプレートは、静的フォルダの下に置くことができ、テンプレートを処理するために、Thymeleafを必要としない、と$ routeProviderで、あなたはこのように、テンプレートの場所を提供する場合：

templateUrl: 'pages/dashboard.html', //the template is under static/pages 

テンプレートを処理するために、Thymeleafが必要です場合は、テンプレートフォルダの下にテンプレートを置き、そして$ routeProviderにしなければならない、あなたはこのように、テンプレートの場所を提供します。

templateUrl: 'dashboard', //this is more like a nick name, there is no .html 

これは、バックエンドThymeleafからダッシュボードを取得するために角度伝えます。 Java側では、私たちは、あなただけの大きなdivタグ内でそれらを保つことができますテンプレートについてthymeleafテンプレート

@Configuration 
public class WebConfig extends WebMvcConfigurerAdapter { 

    @Override 
    public void addViewControllers(ViewControllerRegistry registry) { 
     super.addViewControllers(registry); 
     registry.addViewController("/login").setViewName("auth/login");//register controllers that will expose template 
     registry.addViewController("/dashboard/**").setViewName("pages/dashboard"); //At here, you mapping the nick name and indicate the template is actually located under templates/pages 


     //for Angular Directives 
     registry.addViewController("/breadcrumb").setViewName("directives/breadcrumb"); 
     registry.addViewController("/flipcard").setViewName("directives/flipcard"); 
     registry.setOrder(Ordered.HIGHEST_PRECEDENCE);  
    } 
} 

を公開するのViewControllerを追加する必要がある、とヘッダとボディタグを追加する必要はありませんそれを完全なhtmlにします。