在 ionic 中定义 UI 元素的不同方法答案

【问题标题】：Different ways to define UI elements in ionic在 ionic 中定义 UI 元素的不同方法
【发布时间】：2016-03-29 16:25:35
【问题描述】：

使用 ionic 框架构建应用程序时，可以通过两种方式定义 UI 元素：

使用div标签：

<div class="bar bar-header bar-positive">
  ...
</div>

使用指令：

<ion-header-bar class="bar-positive">
  ...
</ion-header-bar>

在documentation 中，使用了第一个变体（使用div）。但是在我正在观看的课程中，使用了第二个课程（我觉得它更干净）。

上面显示的两种方式有什么区别？是否有首选或推荐的方式来定义 UI 元素？

【问题讨论】：

【解决方案1】：

如果您需要访问相应的 API，我建议您使用 Directives 而不是 Div。例如列表：http://ionicframework.com/docs/api/directive/ionList/ 使用该指令将允许您使用 API 选项。

但是，如果你只想要一个漂亮的 UI，而不需要 API，你可以使用 div 来快速渲染模板。

【讨论】：

【解决方案2】：

ion-header-bar 标签只是 ionic 编写的指令，具有一些您不会在 div 标签中获得的奇妙属性

属性喜欢：

对齐标题

无点击滚动

这两者都带有 ion-header-bar 标签，所以如果你想对视图执行任何操作，你可以使用 ion 标签或仅用于视图目的，你可以使用 div 标签。

【讨论】：