角js渲染如果

Question

我在ng-repeat中有多列數據呈現，當我單擊某個項目表單列時會顯示另一列，但是當我單擊最后一列中要顯示表單的特定項目時，我嘗試使用ng-如果要凈渲染錯誤列中的表單，但是當最后一列被渲染並且我按項目時，表單不僅在最后一列上，而且在所有列上都出現

這是我的代碼：

<div class="span4 menu-board" data-ng-repeat="menu in $parent.MENU">
                <ul class="nav nav-tabs nav-stacked">


                    <li data-ng-if="last_admin_code == 'CWR Acknowledgement Transaction Status'">
                        <!--xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->
                        <div class="editor span8" id="RECORD">
                            <button type="button" class="btn btn-mini btn-toggle">
                                <i class="icon-pencil"></i>
                            </button>
                            <div class="DETAIL">
                                <div class="row span8 display">
                                    <div class="span3 control-label"><p>Status Name:</p></div>
                                    <div class="span5"><b><span>Accepted with Changes</span></b></div>
                                    <div class="clearfix"></div>
                                </div>
                                <div class="row span8 display">
                                    <div class="span3 control-label"><p>Status Code:</p></div>
                                    <div class="span5"><b><span>AC</span></b></div>
                                    <div class="clearfix"></div>
                                </div>
                                <div class="row span8 display">
                                    <div class="span3 control-label"><p>Status Description:</p></div>
                                    <div class="span5"><b><span>&nbsp;</span></b></div>
                                    <div class="clearfix"></div>
                                </div>
                                <div class="row span8 display">
                                    <div class="span3 control-label"><p>Acknowledgement Category:</p></div>
                                    <div class="span5"><b><span>Accepted</span></b></div>
                                    <div class="clearfix"></div>
                                </div>
                                <div class="clearfix"></div>
                            </div>
                            <div class="FORM">
                                <form action="#" method="POST" class="form-horizontal" id="form2" onsubmit="return false;">
                                <fieldset id="fieldset1">
                                    <div class="control-group">
                                        <label class="control-label">Status Name:</label>
                                        <div class="span3 controls">
                                            <input class="span3" type="text" novalidate="" value="Accepted with Changes" />
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label">Status Code:</label>
                                        <div class="span3 controls">
                                            <input class="span3" type="text" novalidate="" value="AC" />
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label">Status Description:</label>
                                        <div class="span3 controls">
                                            <textarea class="span3"></textarea>
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label">Acknowledgement Category:</label>
                                        <div class="span3 controls">
                                            <select class="span3" novalidate="">
                                                <option>Accepted</option>
                                                <option>Rejeted</option>
                                                <option>Other</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="clearfix" style="margin-bottom: 20px;"></div>

                                    <div class="">
                                        <button class="btn btn-primary pull-right">Save</button>
                                        <button class="btn btn-danger pull-right"  style="margin-right: 10px;">Delete</button>
                                        <ul class="nav nav-pills pull-right" style="margin-right: 10px; margin-bottom: 0px;">
                                            <li><a href="javascript:void(0);" onclick="$(this).parents('.editor').removeClass('active');">Cancel</a></li>
                                        </ul>
                                    </div>
                                    <div class="clearfix"></div>
                                </fieldset>
                            </form>
                            </div>
                        </div>
                    </li>


                    <!--<li class="header"><a href="#/data/{{$parent.MENU[$index].id}}" onclick="return false;">{{$index}}: {{menu.title}}</a></li>-->
                    <li data-ng-repeat="$admin in admins.data | filter:{parent_id:$parent.MENU[$index].id}">
                        <a data-ng-builder data-ng-click="$parent.addBreadcrumbItem($admin, ($parent.$index + 1) );" ng-class="{active: ($parent.SELECT_PARENT==admin.id)}">{{$admin.reference_data.code}} <span class="pull-right icon-chevron-right"></span></a>
                    </li>               



                </ul>
            </div>

我的問題是如何根本不渲染表單，不要用ng-show或ng-if隱藏它

Answer 1

ng-switch正是為此目的而設計的。 實際上，它會根據條件將項目刪除並將其插入DOM。

Answer 2

我通常使用angular-ui中的ui-if。

https://github.com/angular/angular.js/blob/master/src/ng/directive/ngIf.js