1

application.html.erbRails アプリケーションでAngular を使用しています。app/views/layoutフォルダー内は次のようになります。

<!DOCTYPE html>
<html>
<head>
  <title>Fmtemp</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= csrf_meta_tags %>
</head>
<body ng-app="fmview">
<%= yield %>
<%= javascript_include_tag "application" %>
</body>
</html>

次のようにコード化されapp/views/fmtestた別のフォルダーがあります:index.html

<h1> Greetings from FMView App </h1>
<a href="#/list"> List </a>&nbsp;
<a href="#/grid"> Grid </a>
<div ng-view></div>

今、私のアプリケーションの HTML レンダリングは非常に奇妙です:

<html>
    <head>
        <style type="text/css">@charset "UTF-8";[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide{display:none !important;}ng\:form{display:block;}</style>
        <title>Fmtemp</title>
        <link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css">
        <link href="/assets/fmview.css?body=1" media="all" rel="stylesheet" type="text/css">
        <meta content="authenticity_token" name="csrf-param">
        <meta content="Vwo3zN2lK8hvLPQcV3llnGnvgNqCLaHHsBubSRaYueg=" name="csrf-token">
        <style type="text/css"></style></head>
    <body ng-app="fmview" class="ng-scope" style="">
        <h1> Greetings from FMView App </h1>
        <a href="#/list"> List </a>&nbsp;
        <a href="#/grid"> Grid </a>
        <!-- ngView -->
        <div ng-view="" class="ng-scope">
        <title>Fmtemp</title>
        <link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css">
        <link href="/assets/fmview.css?body=1" media="all" rel="stylesheet" type="text/css">
        <meta content="authenticity_token" name="csrf-param">
        <meta content="Vwo3zN2lK8hvLPQcV3llnGnvgNqCLaHHsBubSRaYueg=" name="csrf-token">


        <h2>List View Welcomes you</h2>

        <script src="/assets/angular-1.2.js?body=1" type="text/javascript"></script>
        <script src="/assets/angular-route.min.js?body=1" type="text/javascript"></script>
        <script src="/assets/fmview.js?body=1" type="text/javascript"></script>
        <script src="/assets/application.js?body=1" type="text/javascript"></script>


        </div>
        <script src="/assets/angular-1.2.js?body=1" type="text/javascript"></script>
        <script src="/assets/angular-route.min.js?body=1" type="text/javascript"></script>
        <script src="/assets/fmview.js?body=1" type="text/javascript"></script>
        <script src="/assets/application.js?body=1" type="text/javascript"></script>
    </body>
</html>

これらの JS と Sylesheets は繰り返し含まれています。

今、ヘッダーやコードを含めようとすると、divapplication.html.erb 内で繰り返されます...ng-view

あちこち動き回ってみまし<yield>たが、同じで問題があります。

4

2 に答える 2

1

angular テンプレートはどこから提供されていますか?

それらがルート/コントローラー/ビュー（パブリックディレクトリではなく）を介して提供されている場合、それらは別のレイアウトテンプレートで提供されるため、ここに示すようにレイアウトが複製されます-レンダリングされたページの1つのレイアウト+ ng-の1つのレイアウトテンプレートの URL を表示します。

これを回避するには、ng-view テンプレートが提供している controller.rb ファイルに以下を追加します。

layout false

または、パブリック フォルダーから angular テンプレートを提供します。

于 2013-11-17T16:49:26.900 に答える
0

この変更を試してください。

<!DOCTYPE html>
<html ng-app="fmview">
<head>
  <title>Fmtemp</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= csrf_meta_tags %>
  <%= javascript_include_tag "application" %>
</head>
<body>
<%= yield %>
<div ng-view></div>
</body>
</html>
于 2013-10-28T08:50:28.550 に答える