angularjs - 将条件视图逻辑移动到控制器方法

Question

我们目前正在考虑优化我们的 AngularJS 视图。目前，视图中通常有相当多的条件逻辑来确定是否应该显示某些内容，例如：

ng-if="(vm.a && vm.b) || vm.c === 'something'"

在视图中有这个条件逻辑并不是很好，而是正在考虑将这个逻辑转移到控制器。

将此条件逻辑移出视图并移入控制器（它所属的位置）的最佳方法是什么？

我尝试了以下方法：

1.尝试使用变量

我最初尝试的是在控制器中创建一个新变量：

this.showIt = (this.a && this.b) || this.c === 'something';

然后在视图中引用该变量：

ng-if="vm.showIt"

但问题是this.showIt条件发生变化时不会更新。

2.尝试使用方法

然后我尝试将其移至一个方法：

showIt(){ return (this.a && this.b) || this.c === 'something'; }

然后在视图中调用该方法：

ng-if="vm.showIt()"

但这会执行很多次。

3.考虑改变调用方法

this.showIt = false;
updateShowIt() { this.showIt = (vm.a && vm.b) || vm.c === 'something'; } 

然后当其中一个变量可能已更改时，调用updateShowIt()，但这将导致整个项目的代码无法管理，使问题变得更糟，而不是更好。

标签： angularjs