Clever Geek Handbook

Virtual elements for ng-if and ng-repeat

I am new to angularjs. Can't find a way to put a couple of elements li

together inside ng-if

. The knockout had virtual elements doing tasks like this

<ul>
    <li>This item always appears</li>
    <!-- ko if: someExpressionGoesHere -->
        <li>I want to make this item present/absent dynamically</li>
        <li>I want to make this item present/absent dynamically</li>
    <!-- /ko -->
</ul>

Would be grateful for the help.

update . Inside a container like <div>

or <span>

is a view distortion is placed when used inside a nav in bootstrap:

<div ng-if="!auth.user">
   <li>
    <a href="#!/signup">Sign up <span class="glyphicon glyphicon-list-alt"></span></a>
    </li>
    <li>
    <a href="#!/login">Sign in <span class="glyphicon glyphicon-log-in"></span></a>
    </li>
</div>

Sanjay

+3


source to share


2 answers


It's basically something like:

<li ng-if="conditionExpression">I want to make this item present/absent dynamically</li>

or, if you want to avoid covering the scope:



<li ng-show="conditionExpression">I want to make this item present/absent dynamically</li>

Update If you want to group several elements within one ng-if

, you need to put them in a container or just add ng-if

to each of them separately. See example

+1


source


See How to use ng-repeat without html element



You can use ng-repeat-start to avoid having to have an extra element with ng-repeat.

-1


source






More articles:


All Articles