手風琴使用純angularjs沒有CSS

我想隱藏其他的細節，顯示當前點擊名稱手風琴使用純angularjs沒有CSS

http://jsbin.com/tewegahobi/edit?html,js,output

<li ng-click="showDetail = true" ng-repeat="item in items">{{item.name}} 
     <span ng-show="showDetail == true">{{item.detail}}</span> 
     </li>

不知道我這樣做是正確的，我可以的細節點擊以顯示詳細信息，但當我點擊特定名稱時，它不會隱藏他人的詳細信息。

來源

2016-09-07 dfox

您可以通過使用scope監控哪個項目被點擊來一次顯示一個名稱。然後，您還可以使用scope來定義一個函數，以便與ng-click一起使用，以便當該用戶單擊某個值發生更改的項目時。每個項目具有ng-show屬性，只有當它與之前由用戶選擇的項目匹配時才顯示項目。

function TodoCrtl($scope) { 
 
    $scope.items = [{name:"James",detail:"something of James"},{name:"John",detail:"something of John"}] 
 

 
    // Holds the mame of the item clicked by the user. 
 
    $scope.chosen = ''; 
 

 
    // This function is activated each time the user clicks on an element 
 
    // with 'ng-click' that is associated with this funciton. 
 
    $scope.setChosen = function(itemName) { 
 
    $scope.chosen = itemName; 
 
    } 
 
}

<!DOCTYPE html> 
 
<html ng-app> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script> 
 
<meta charset=utf-8 /> 
 
<title>ng-click</title> 
 
</head> 
 
<body> 
 
    
 
<div ng-controller="TodoCrtl"> 
 

 
<li ng-click="setChosen(item.name)" ng-repeat="item in items">{{item.name}} 
 
    <span ng-show="item.name == chosen">{{item.detail}}</span> 
 
    </li> 
 

 
</div> 
 
</body> 
 
</html>

來源

2016-09-07 05:43:51 Mike

我不知道這是他想要的東西......他想得只有一個時所顯示出的細節，我想。 –

@Zenek在重讀之後我認爲你是對的 – Mike

@Mike是的，但有可能沒有在控制器級別的功能？ – dfox

手風琴使用純angularjs沒有CSS

回答

相關問題