Reputation: 2795
What I am trying to do is:
When the dropdown toggle is clicked, if Text is clicked, it will show "test_now", if Paragragh Text is click, it will show "text list".
But I tried several times and it still not working, could someone help me on that? thanks so much!
Here is my code:
<li class="dropdown">
<button class="btn btn-default dropdown-toggle">Add item</button>
<ul class="dropdown-menu">
<li ng-repeat="choice in items" ng-model="selection">
<a>{{choice.type}}</a>
</li>
</ul>
</li>
<div ng-switch on "selection">
<div class="question_typeText" ng-switch-when="Text">
test_now
</div>
<div class="question_typeList" ng-switch-when="Paragraph Text">
test_list
</div>
</div>
js part:
angular.module('DFS', ['ui.bootstrap']);
function PageCtrl($scope) {
$scope.items = [
{
type: "Text"
},
{
type: "Paragraph Text"
},
{
type: "Multiple Choice"
},
{
type: "Checkboxes"
},
{
type: "Choose from a list"
}
];
$scope.selection = $scope.items[0].type;
}
Upvotes: 0
Views: 1869
Reputation: 3466
Here is my example code:
<div ng-controller="PageCtrl">
<li class="dropdown">
<button class="btn btn-default dropdown-toggle">Add item</button>
<ul class="dropdown-menu">
<li ng-repeat="choice in items">
<a ng-click="click(choice)">{{choice.type}}</a>
</li>
</ul>
</li>
<div ng-switch on="selection">
<div class="question_typeText" ng-switch-when="Text">
test_now
</div>
<div class="question_typeList" ng-switch-when="Paragraph Text">
test_list
</div>
angular.module('myApp', []);
function PageCtrl($scope) {
$scope.items = [
{
type: "Text"
},
{
type: "Paragraph Text"
},
{
type: "Multiple Choice"
},
{
type: "Checkboxes"
},
{
type: "Choose from a list"
}
];
$scope.click = function(choice){
$scope.selection = choice.type;
}
$scope.selection = $scope.items[0].type;
}
or angularjs.org example
http://docs.angularjs.org/api/ng/directive/ngSwitch
Upvotes: 3