AngularJS If Checkbox是檢查顯示
[英]AngularJS If Checkbox is check display
問題描述
有人可以告訴我為ng-repeat創建If / Else語句的正確語法嗎？ 簡而言之，如果選中復選框，則顯示最大數量范圍。 如果未選中，則顯示分鍾。 我已經搜索了，但是在頁面上而不是在控制器內部找不到語法。
**json**
{
"min": ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"],
"max": ["91", "92", "93", "94", "95", "96", "97", "98", "99", "100"]
}
**Inside my controller declaring scope**
$scope.min = response.data.min;
$scope.max = response.data.max;
**display.html**
<input type="checkbox" name="min-max" id="min-max" class="css-min-max" checked="checked"/>
<div ng-repeat="info in min"> <--- this is my problem.
<p>{{info}}<p>
</div>
4 個解決方案
解決方案1
1 已采納 2016-08-25 01:19:04
也許您正在尋找比您描述的用例更多的東西（其他答案中有很好的解決方案）
這是很長的路要走：
<body ng-app="listByCheckbox" >
<div ng-controller="listDisplayCtrl">
<input type="checkbox" ng-model="checkedList" ng-init="checkedList=true"/>
Check the box for low numbers, un-check box for high numbers
<div ng-value= "selectedList = checkedList ? listOptions.min : listOptions.max" >
<p ng-repeat="info in selectedList">{{info}} is a fine number.<p>
</div>
</div>
</body>
按照您的要求，其中沒有邏輯的控制器如下：
var app = angular.module('listByCheckbox', [])
app.controller('listDisplayCtrl', function ($scope) {
$scope.listOptions = {
"min": ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"],
"max": ["91", "92", "93", "94", "95", "96", "97", "98", "99", "100"]
}
})
解決方案2
0 2016-08-24 20:55:02
您可以使用ng-show（復選框為ng-mode）並具有兩個html節點或一個過濾器。
<label class="item item-text-wrap" ng-show="checked"></label> <label class="item item-text-wrap" ng-show="notchecked"></label>
解決方案3
0 2016-08-24 21:05:55
您可以通過控制器的方法調用動態選擇集合。
控制器：
$scope.selected = false;
$scope.choose = function() {
return $scope.selected ? $scope.max : $scope.min;
}
HTML：
<input ... ng-model="selected">
<div ng-repeat="info in choose()">
解決方案4
0 2016-08-24 21:22:13
將您的HTML修改為
<input id="some_id" type="checkbox" ng-checked="minmax">
<div ng-repeat="info in repeatData">
<p>{{info}}</p>
</div>
將以下內容添加到您的控制器中
if(minmax){
$scope.repeatData=response.data.max;
}
else
{
$scope.repeatData=response.data.min;
}
Angularjs + Check Checkbox是否被點擊
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.