用 Angular 干掉 HTML答案

【问题标题】：DRY-ing up HTML with Angular用 Angular 干掉 HTML
【发布时间】：2014-06-29 00:50:15
【问题描述】：

我有许多 Angular 控制器，其中包含以下代码块（包括一些我无法排除的更具体的内容）。

<h3>
  <i class="fa fa-info-circle pull-left" tooltip-html-unsafe="{{tooltip}}"></i>
  {{title}}
  <i class="fa fa-refresh fa-spin pull-right" ng-if="!dataLoaded"></i>
  <i class="fa fa-check fa-green pull-right" ng-if="dataLoaded && !dataError"></i>
  <i class="fa fa-exclamation fa-red pull-right" ng-if="dataError"></i>
</h3>

我希望以最 Angular-ist 的方式解决所有这些问题。那会使用指令吗？此外，如果我将这段代码排除在外，所有特定于控制器的{{tooltip}} 和{{title}} 属性以及ng-ifs 是否仍然有效？谢谢--

【问题讨论】：

标签： javascript angularjs dry

【解决方案1】：

如果您使用指令，则必须使用“=”绑定范围，然后一切正常。您可以这样做的另一种方法是将其放入 HTML 文件中，然后将其放入 ng-include 中的应用程序中，如下所示：

<div ng-include="myfile.html">
</div>

如果您使用 ng-include 执行此操作，您的控制器中的所有内容都会像平常一样绑定到它。

【讨论】：