Estoy trabajando con Angular js en una aplicación modular. Cuando un usuario ingresa en la aplicación, ésta determina el numero de embarcaciones que tiene la compañía y en la vista de menús muestra un selector que permite seleccione una de las embarcaciones para administrarla.
<ul class="dropdown-menu animated fadeIn m-t-xs">
<li>
<a ng-click="changeBoat(boatInfo)" class="ng-binding">
182 / ASTROBOAT
</a>
</li>
<li>
<a ng-click="changeBoat(boatInfo)" class="ng-binding">
180 / START BOAT
</a>
</li>
<li>
<a ng-click="changeBoat(boatInfo)" class="ng-binding">
178 / STORM BOAT
</a>
</li>
</ul>
Además en el módulo de dashboard
que aparece en la misma pantalla, la aplicación muestra una tabla con la información de todas las embarcaciones. El punto es, cuando la compañía sólo tiene una embarcación, no tienen sentido mostrar el selector ni la tabla. Quiero utilizar otros componentes en esos casos. Estoy pensando en crear una directiva user-if-single-boat
, que permita mostrar u ocultar componentes en todas las vistas, algo así:
<ul class="dropdown-menu animated fadeIn m-t-xs" user-if-single-boat> ...
<table class="..." user-if-single-boat> ...
Sé también que podría hacerlo con un ng-if
que valide una variable en el $rootScope
(<ul class="dropdown-menu animated fadeIn m-t-xs" ng-if='isMultiBoats'>
), pero no quisiera usar el $rootScope
en sí, teniendo en cuenta que la validación de ese atributo se debe hacer a lo largo de todos los módulos de la aplicación. ¿Qué otra alternativa tengo para ello, o cómo debería ser esta directiva?