当用户的角色是雇员时，使用Ng-show或ng-if隐藏按钮

Question

Trying to figure out ng-show and ng-if. I want to show a button only when you are logged in as a admin. If the user is employee then the button has to be hidden.

Part of my html code:

 <md-button ng-show="user.role == 'admin'" class="md-raised md-primary pull-left customYellow" aria-label="Add a user" ng-click="showPopUpAddUser($event)">
        <md-icon md-svg-src="assets/images/person_add.svg"></md-icon>
        <md-tooltip>
         Invite a user
        </md-tooltip>
     </md-button>

Part of my app.js code:

$scope.inviteUser = function(){
    $http.post('/api/users/invite', {
        'email': $scope.user.email,
        'role_id': $scope.user.role
    }, {
        headers: {
            "Content-Type": "text/plain"
        }
    })
    .success(function(data, status, headers, config) {
        console.log("Successfully saved a user to the DB", data);

        $scope.userInfo.push(data);

    })
    .error(function(data, status, headers, config) {
        console.log("Failed to add user to DB");
    });
}

 $scope.adminID = function(id) {
            var adminId = $scope.getCurrentUser().role_id;
            console.log("logging id admin-->", adminId);

            //$scope.user = { role : false };

            $scope.userRole = adminId;
            //console.log("fafdasfdsafadfdfsf---------->",  $scope.userRole)
        }
        $scope.adminID();

Answer 1

Try like this

ng-show="user.role == 'admin'"

You forget to add '' in your code

Answer 2

I'm not a huge fan of logic on the view. This is just a personal preference but i would abstract the === into a filter:

app.filter('equals', function () {
   return function (actual, expected) {
       return actual === expected;
   };
});

then on the view:

ng-show="admin.role | equals:'admin'"