应该在过滤后选择AngularJs :: First Radio按钮,并将IsSelected设置为true,将其他设置为false

时间:2017-01-30 08:26:30

标签: angularjs radio-button

  

请查看示例



//
var ngApp = angular.module('app', []);
 
ngApp.controller('ctrl',function($scope){

$scope.setSelected = function ($data, $pData) {
        angular.forEach($data, function (cu) {
                cu.IsSelected = false; 
        });
      $pData.IsSelected = true; 
    };
    $scope.BusArray = [
	[{

		"BusName": "Ax. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 1200,
		"IsSelected": true
	}, {

		"BusName": "Bx. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 1600,
		"IsSelected": false
	}, {

		"BusName": "Bx. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 800,
		"IsSelected": false
	}, {

		"BusName": "Nx. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 400,
		"IsSelected": false
	}],
	[{

		"BusName": "Ax. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 1100,
		"IsSelected": true
	}, {

		"BusName": "Nx. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 1400,
		"IsSelected": false
	}, {

		"BusName": "Nx. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 600,
		"IsSelected": false
	}, {

		"BusName": "Bx. Travels",
		"Origin": "DEL",
		"Destination": "JAI",
		"TotalFare": 500,
		"IsSelected": false
	}]
];
    
   
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" >
    <div ng-controller="ctrl">
    
Type(Bx/ Nx / Ax): <input type="text" ng-model="checkPrice">
        <div ng-repeat="buses in BusArray">
        <span>group{{$index+1}}</span>
        <form>
      <div ng-repeat="bus in dd=(buses|filter:checkPrice)">
    <label style="font-size:12px; background-color:green; padding:2px;">
                <input name="{{$parent}}" id="{{$parent.$index}}{{$index}}" type="radio" ng-checked="bus.IsSelected" ng-click="setSelected(buses,bus)" />
                {{bus|json}}
               </label>
         
            </div>
              </form>
            <div>
        </div>
        
        <hr/>
     
    </div>
       {{BusArray | json}}
</div>
&#13;
&#13;
&#13;

::

  

我需要的是

     

------------- Case ::

     

如果我输入&#34; bx&#34;在输入框中::   第1组:: 第一个单选按钮被选中,&#34;被选中&#34;设置为true而其他设置为false,如果我删除过滤器应该设置它   旧数据(即&#34;总线阵列&#34;)。   **第2组:与第1组相同

1 个答案:

答案 0 :(得分:0)

我在这里做了一些改变..检查小提琴 - fiddle

$scope.isSetSelected = function(isSet , $data , $pData,isFirst){
      if(isSet) return true;
      else{
        var isAnyDataSelected = false;
        angular.forEach($data, function (cu) {
                if (cu.IsSelected )
                  isAnyDataSelected = true;
        });
        if(isAnyDataSelected)
            return false;
        else if(isFirst)
          return true;
      }
 }