如何使用 ng-if 根据当前用户显示按钮？答案

【问题标题】：How can I use ng-if to display a button based on the current user?如何使用 ng-if 根据当前用户显示按钮？
【发布时间】：2017-03-15 15:09:31
【问题描述】：

我正在创建一个用户个人资料，并希望显示一个仅为个人资料所有者显示的编辑按钮。我正在尝试使用 ng-if 以便从 DOM 中删除编辑功能。

如何使用 ng-if 根据当前用户显示按钮？

在我看来：

<button ng-if="editProfile()">EDIT</button>

在我的控制器中：

$scope.editProfile = function (canedit) {
  var canedit = false;
  for (var i=0;i<$scope.users.length;i++) {
    if ($scope.users[i].id===$scope.currentUser.id) {
      canedit = true;
     }
  }
}

【问题讨论】：

有什么好，问题是你错过了return

标签： javascript angularjs authentication angular-ng-if

【解决方案1】：

您的函数需要返回true 或false

<button ng-if="editProfile()">EDIT</button>


$scope.editProfile = function () {
  for (var i=0;i<$scope.users.length;i++) {
    if ($scope.users[i].id===$scope.currentUser.id) {
      return true
     }
  }
  return false
}

【讨论】：

【解决方案2】：

您的函数没有返回任何内容。

你可以这样做

<button ng-if="canEdit()">EDIT</button>

在你的控制器中

$scope.canEdit = function () {
    return $scope.users.find(u=>u.id === $scope.currentUser.id) ? true : false;
}

【讨论】：

【解决方案3】：

只需添加

return canedit;

在右括号下方

【讨论】：

【解决方案4】：

正如大家提到的，该函数没有返回 true 或 false。添加 return 后，我发现 for 语句是多余的，我只需要一个简单的检查。此代码工作正常：

$scope.editProfile = function () {
  if ($scope.user.id===$scope.currentUser.id) {
    return true
  }
   return false
 }

【讨论】：