Question

我想在app.html.ex模板中加入导航栏。类似的东西：

<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">My app</a>
    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="/">Home</a></li>
        <li><a href="help">Help</a></li>
        <li><a href="contact">Contact Us</a></li>
      </ul>
    </div>
  </div>
</nav>

有没有办法渲染ul，以便它可以根据当前控制器附加class="active"？

Answer 1

我还没有看到过渲染导航的方法。或者，您可以编写一些辅助方法。

要设置class="active"，我会向layout_view.ex添加一些方法。

def is_example_path(conn) do 
  controller_module(conn) == MyApp.ExampleController
end

所以你可以在你的模板中添加这样的东西。

<ul>
  <li class="something <%= if is_example_path(@conn), do: " active" %>">Example</li>
</ul>

希望这有帮助。

使用Phoenix Framework渲染导航的最佳方法是什么？

1 个答案: