2015-09-23 74 views
1

我想在angularjs中使用ng-hide和ng-show編碼解決方案。在點擊隱藏之前,它會在隱藏之前延遲顯示視圖面板。請問可能是錯的。這是我製作的一名運動員。隱藏工作不正常

http://plnkr.co/edit/IiSwQ1cijiypdwIXV6K7?p=preview

這是代碼視圖:

<div ng-app="myApp"> 
    <h1>Ng-show & ng-hide</h1> 
    <p class="description">Click on the "show"-link to see the content.</p> 
    <a href="" ng-click="showme=true">Show</a> 
    <button ng-click="showme=false">Hide</button> 

    <div class="wrapper"> 
    <p ng-hide="showme">It will appear here!</p> 
    <h2 ng-show="showme">This is mah content, yo!</h2> 
    </div> 

</div> 

回答

1

其上,因爲你已經添加動畫效果,其中有2秒延遲transition同時隱藏h2標籤。減少這種轉變將提高速度。 爲擺脫延遲的同時隱藏元素,您應該刪除css CSS

h2 { 
    color: #2980b9; 
    margin-bottom: 9px; 
    margin-top: 0; 
    font-size: 20px; 
    background-color: white; 
    /*width: 100px;*/ 
    text-align: center; 
    padding: 16px; 
    z-index: 15; 
    border-radius: 4px; 
    /*transition: all 0.1s ease-out;*/ //<-- reduced it to 0.1 sec will 
} 

Plunkr Here

+0

transition財產點擊隱藏,它延遲了一會兒。我想避免這種行爲 – Blaze

+0

@JnG我沒有得到你? –

+0

我想避免點擊隱藏按鈕的延遲。問候。 – Blaze