AngularJS 部分布局上的工具栏

AngularJS toolbar on partial layout

我是一名初级 AngularJS 开发人员,我正在寻找实现我正在制作的工具栏的正确方法。目前我的应用程序在多个级别上工作,具有:

app - angular 应用程序的根和多个 app.sub-level(s) - 具有不同的嵌套级别。

点在应用程序模块上我有一些部分视图(其中一个是工具栏),在我的抽象应用程序状态视图下的控制器中进行了处理。

我想做的是根据 app.sub 级别 (.state) 的状态更改控制器中按钮的行为(例如 "delete" 按钮的外观)

正确的做法是什么?

我读过有关使用 $rootScope 的文章,(据我所知)不建议这样做,因为它非常接近全局变量。

我也读过有关使用服务的信息,但如果我只更改其中的变量,服务不会改变。

那么,有什么正确的方法吗?

提前致谢,抱歉这么长 post,我正在尽我所能解释!

编辑: 我也必须为按钮分配不同的行为(ng-ref 和整个函数)

对于外观,使用ng-class。例如:

<button ng-class="{dull: sub-level.state==0, shiny: sub-level.state!=0}">
</button>

此示例将在按钮上设置 class:当 sub-level.state 为 0 时为 dull,否则为 shiny。这些 class 需要在您的 CSS.

中定义

请注意,在此示例中,sub-level.state 需要是一个 $scope 可访问变量。 (即 $scope.sub-level.state 必须存在于相关控制器中)

这只会影响按钮的外观。如果您想根据某些表达式实际禁用它,请查看 ng-disabled