1
votes

Comment accéder à $ rootScope dans la vue (cshtml)

J'ai le code suivant

<div class="hidden-sm hidden-xs" style="text-align: center;">
    <ul class="header-menu">
        <li ng-if="$root.permissions[1].includes('permissionName')"><a ng-class="{ activeMenuItem: isActive('/Cases')}" ui-sref="Caes" class="current">My Cases<span class="count-wrap" ng-show="getCases() > 0" ng-bind="getCaseCount()" ng-cloak></span></a></li>
        <li ng-if="permissions[1].includes('permissionName')"><a ng-class="{ activeMenuItem: isActive('/Lawyers')}" ui-sref="Lawyers" class="current">My Lawyers<span class="count-wrap" ng-show="Law.Lawyer > 0" ng-bind="Law.LawyerCount" ng-cloak></span></a></li>
    </ul>
</div>

et je souhaite masquer le ou les onglets

en fonction des autorisations. J'ai essayé plusieurs choses mais je n'ai pas pu trouver de solution. En lisant en ligne comment utiliser rootScope, je suis tombé sur des articles qui avaient une solution avec l'utilisation de $ root mais qui ne fonctionnaient pas non plus.

...
...
...
if (response.data) {
    console.log("response data was not null");
    if (response.data != null) {
        $rootScope.permissions = response.data.permissions;
        console.log("permissions: ", $rootScope.permissions);
        localStorage.setItem("UserPermissions", JSON.stringify($rootScope.permissions));        
...
...
...

C'est il est un peu difficile de créer un extrait de code, mais je cherche des conseils pour savoir s'il y a une meilleure façon de le faire ou si je le fais mal.

angularjs

0 commentaires

3 Réponses :

0
votes

Vous n'avez pas besoin de spécifier $ rootScope dans la vue ypur. Vous pouvez l'utiliser de la même manière que vous utilisez les variables $ scope.

	
	
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">

	<div class="hidden-sm hidden-xs" style="text-align: center;">
		<ul class="header-menu">
			<li ng-repeat="permission in permissions">
			<a ng-if="permission.isActive">{{permission.name}} is Active<span class="count-wrap" ng-show="getCases() > 0" ng-bind="getCaseCount()" ng-cloak></span></a>
			<a  ng-if="!permission.isActive">{{permission.name}} is Not Active<span class="count-wrap" ng-show="getCases() > 0" ng-bind="getCaseCount()" ng-cloak></span></a>
			</li>			
		</ul>
	</div>

</div>

var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope,$rootScope) {
    //set permissions to rootScope
    $rootScope.permissions=[{name:"permission 1",isActive:true},{name:"permission 2",isActive:false}]

});

0 commentaires

0
votes

Face à cela dans une application, et aussi pour que la valeur soit mise à jour dans la vue, j'ai utilisé une fonction getter pour obtenir les valeurs $ rootScope dans le contrôleur (j'ai pris l'habitude de nommer mes contrôleurs mais si vous ne le faites pas, supprimez simplement ctrl. ):

Dans la vue:

function ctrlFunc($rootScope) {
    this.getPermissions = function(){ //or whatever way you use to define your functions, with $scope or this
        return $rootScope.permissions;
    };
}

Dans la fonction du contrôleur: p >

<li ng-if="ctrl.getPermissions()[1].includes('permissionName')">...

0 commentaires

0
votes

Essayez:

ng-if="::$root.permissions.length > 1 && ::$root.permissions[1].includes('permissionName')"

0 commentaires