如何使用ng-if显示基于当前用户的按钮?

时间:2017-03-15 15:09:31

标签: javascript angularjs authentication angular-ng-if

我正在创建用户个人资料,并希望显示仅为个人资料所有者显示的编辑按钮。我试图使用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;
     }
  }
}

4 个答案:

答案 0 :(得分:1)

您的功能需要返回truefalse

<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
}

答案 1 :(得分:0)

你没有从你的功能中返回任何东西。

你可以这样做

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

并在您的控制器中

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

答案 2 :(得分:0)

添加

return canedit;
在结束括号

下面的

答案 3 :(得分:0)

正如大家所提到的,该函数没有返回true或false。添加返回后,我发现for语句是无关紧要的,我只需要一个简单的检查。此代码工作正常:

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