1

背景:作为我正在从事的项目的一部分,用户(在下面的案例中称为“艺术家”)可以选择从一系列角色中选择一个或多个角色:经理、制片人、代理等。因此,我需要根据用户选择的角色显示或隐藏页面的某些部分。

示例:当用户选择“经理”作为他/她的角色之一(并且在未选择“经理”时将其隐藏)时,我尝试使用以下有条件地显示一个 div,但没有运气。我应该在 ng-show 指令中使用什么?

<div class="manager_section" ng-show="data.artist.roles.name == 'Manager'">Sample Text Here</div>

请注意:在没有应用 ng-show/ng-hide 指令的情况下,div 看起来很好,所以我不是在寻找 CSS 答案或任何东西;我只是在寻找 ng-show/ng-hide 提供的条件方面。而且我知道角色的数据正在被拉到页面上,因为当我在页面上运行以下命令对其进行测试时,用户选择的每个角色的名称都准确显示:

<div ng-repeat="role in data.artist.roles">{{ role.name }}</div>
4

1 回答 1

1

如果您需要运行任意 JavaScript 代码,可以使用控制器方法。

例如:

<div class="manager_section" ng-show="isAuthorized('Manager')">Sample Text Here</div>

angular.module('myApp', [])
                 .controller('AppCtrl',function(){
                    $scope.isAuthorized = function(role){
                        for(var i=0;i<$scope.data.artist.roles.length;i++){
                           if($scope.data.artist.roles[i].name === role) return true;
                        }
                        return false;
                    }
                 };
于 2014-10-20T21:19:33.920 回答