Вы можете использовать ng-if directive, например, так:
<start-login ng-if="expression">
нг если не будет выводить содержимое тега, если выражение ложно.
Затем в вашем контроллере вы просто устанавливаете выражение в true, когда хотите, чтобы тег был видимым. В вашем примере вы можете использовать переменную checkLogin
вместо выражения, конечно.
Там также есть большая разница между использованием ng-if
и ng-show
. Пользователь может не испытывать этого, так как фактическая разница в том, что ng-show скрывает. Содержимое и ng-if вообще не отображают его. Если мы инспектировать DOM между ними вы увидите, что они похожи на приведенный ниже код в различных состояниях:
Когда выражение истинно:
<start-login ng-show="expression"></start-login>
<start-login ng-if="expression"></start-login>
Когда выражение является ложным:
<start-login ng-show="expression" class="ng-hide"></start-login>
<!-- ngIf: start-login -->
Это большая разница. ng-if полностью удаляет элемент и добавляет комментарий к DOM. Если вы используете ng-show (или ng-hide), угловой добавляет класс к элементу. Класс объявлен как
.ng-hide { display: none; }
, который только инструктирует веб-браузер не отображать элемент в макете. Элемент все еще «вынесен», или , выполненный, может быть лучшим словом, что является основным отличием здесь. Это может иметь реальное влияние при загрузке страницы, особенно если содержимое в элементе ng-if загружает данные с сервера, например. Это также означает, что если ваша директива изменяет DOM и добавляет конфиденциальную информацию, тогда вы должны использовать ng-if!
Вы должны спросить себя, действительно ли вам нужно использовать директиву в этом случае. Например, проверьте эту статью http://www.frederiknakstad.com/2014/02/09/ui-router-in-angular-client-side-auth/, как реализовать функции входа в систему с помощью ui-router. – Piotr