Question

我在主('/')上有菜单控制器。

我有日记按钮，位于('/users')。

日志按钮用数据激活指令模板（隔离范围）。我的目标是将此按钮添加到主菜单。我已经完成了使用rootScope发出指令。

在主页面中插入<my-directive></my-directive>。模板的内部部分由日志主体组件组成。

当我在主页上调用方法打开日记时，我为这些日记组件和案例编写了额外的样式。

问题：我正在使用条件低于

的ng-class

<div class="" ng-if="isOpenTab" ng-class="currentPage === 'slp-editor' ? 'editor-journal-tab': 'users-journal-tab'">

输出：条件的一部分仅适用于所有页面。因为当我在主页面上时，其范围内有currentPage，所以默认情况下users-journal-tab类适用。

如何在不同页面上的同一模板上获取不同的类？

UPD：已成功解决此问题。问题在于将日志指令的数据绑定到主菜单的控制器。至于currentPage是主菜单范围的支柱。它仅接收字符串值，即'slp-editor'。所以我在期刊指令中的@道具上使用了字符串绑定选项currentPage。

Answer 1

首先，您必须确保在指令<my-directive></my-directive>的范围内，变量currentPage可用。（如果您遇到此问题，请查看：How to get the route name when location changes?）

然后你可以在指令的HTML代码中执行类似的操作：

<div ng-class="{class1 : (currentPage === 'slp-editor'), class2 : (currentPage === 'another-editor'), class3 : (currentPage === 'one-more-editor')}">
    Hello World!
</div>

如何将样式应用于发出的指令模板？

1 个答案: