Question

我正在尝试使用左侧<super-navbar>右侧的导航图像，但官方文档中指出，超导航按钮只支持文本。但必须有一些方法来做到这一点。下面是我的代码，我想放置图像而不是文本：

<super-navbar>
    <super-navbar-button side="left" id="hamburger" onclick="supersonic.ui.drawers.open()">Menu</super-navbar-button>
    <super-navbar-title>MyApp</super-navbar-title>
    <super-navbar-button side="right">Search</super-navbar-button>
  </super-navbar>

我想要至少使用汉堡包类型图标或png图像而不是“菜单”文本。搜索文本也是如此。

感谢。

Answer 1

现在可以通过删除<super-navbar>部分并编写自己的html标头来实现。

如果您查看项目的布局文件，则会提到一个import语句：

<link rel="import" href="/components/supersonic/components/import.html">

有一节说明：

* @name super-navbar-button

* When used inside the element, creates a button that will be displayed on the navigation bar. Only text content is supported for the button title.

已请求支持图标。您可以订阅他们的github以获取问题通知。 https://github.com/AppGyver/steroids

能够继续使用<super-navbar>并拥有图标的一种方法是使用这样的东西，它将呈现为≡

<super-navbar-button ng-click="toggleMenuDrawer()">
    &equiv;
</super-navbar-button>

他们在Muut上也有一个很好的论坛。 This issue很可能与尝试在<super-navbar>中添加图标有关。尝试添加标记后，我遇到了一个消失的导航栏：<i class="icon super-search"></i> 它适用于主要内容区域，但是当嵌套在<super>元素中时，导航条的行为会有所不同。

Appgyver：如何在超级导航栏中使用离子图标或图像？

1 个答案: