javascript - 我应该在 angularjs 中重构 ng-if 的多个条件吗？

Question

我有这段代码，我想知道是否有更好的风格来编写它，从而减少 View 中的逻辑。

<span ng-if="status == 'state1' || status == 'state2'">Foobar</span>
<span ng-if="status == 'state3'">Baz</span>

Answer 1

是的，我认为重构是明智的。你的例子很简单，但很容易想象有更多的条件。当许多元素具有复杂的显示条件时，我做过这样的事情:

$scope.render = {
  foobar: function() {
    return $scope.status == 'state1' || $scope.status == 'state2'
  },
  baz: function() {
    return $scope.status == 'state3'
  }
}

那么在 View 中的用法是:

<span ng-if="render.foobar()">Foobar</span>
<span ng-if="render.baz()">Baz</span>

演示:http://plnkr.co/lv4w9dLN8oN0bBF23VKp

这使得 View 中的逻辑足迹很小，并允许您轻松地在多个元素上重用逻辑。