嵌套Dropdown- NG選項裏面NG-重演angularjs

我要趕上父母姓名和身份證上的孩子的選擇。嵌套Dropdown- NG選項裏面NG-重演angularjs

輸出應該是：

$scope.selected = [{"name": "Request1", "id":1, 
        "status":[{"name":"status1","isSelected":true}, 
           {"name":"status2","isSelected":false}] 
        }]

抽到選擇孩子，但各自的父沒有得到。

// Code goes here 
 

 
var app = angular.module('demo', []); 
 

 

 
app.controller('myController', function($scope){ 
 
    $scope.requests=[{"name": "Request1", "id":1}, 
 
        {"name": "Request2", "id":2},{"name": "Request3", "id":3} 
 
        ]; 
 
    $scope.statusList =[{ "name": "status1", "isSelected": true }, 
 
         { "name": "status2", "isSelected": false } 
 
         ] 
 
     function initializeRequestStatus() { 
 
     angular.forEach($scope.requests, request => { 
 
      request.statusList = angular.copy($scope.statusList); 
 
     }) 
 
     }; 
 

 
     initializeRequestStatus(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!DOCTYPE html> 
 
<html ng-app='demo'> 
 

 
    <head> 
 
    <script data-require="[email protected]" data-semver="1.1.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
<div class="container" ng-controller="myController"> 
 
    <div> 
 
     
 
     <ul ng-repeat="request in requests"> 
 
      {{request.name}} 
 
      <li> 
 
       <select class="form-control" ng-options="status as status.name for status in request.statusList" ng-model="request.selectedStatus" multiple></select> 
 
      </li> 
 
     </ul> 
 
     
 
     <ul> 
 
      <li ng-repeat="request in requests">{{request.selectedStatus}}</li> 
 
     </ul> 
 
    </div> 
 
</div> 
 
</body> 
 
</html>

來源

2017-10-09 Raju Sah

-2

您可以利用$指數獲取父名和ID。

// Code goes here 
 

 
var app = angular.module('demo', []); 
 

 

 
app.controller('myController', function($scope){ 
 
    var result = []; 
 
    $scope.requests=[{"name": "Request1", "id":1}, 
 
        {"name": "Request2", "id":2},{"name": "Request3", "id":3} 
 
        ]; 
 
    $scope.statusList =[{ "name": "status1", "isSelected": true }, 
 
         { "name": "status2", "isSelected": false } 
 
         ]; 
 
    
 
    $scope.getParent = function(index, selectedState){ 
 
     result = []; 
 
     var req = { 
 
     "name": $scope.requests[index].name, 
 
     "id": $scope.requests[index].id, 
 
     "status": selectedState 
 
     } 
 
     result.push(req); 
 
     console.log("result",result); 
 
     return angular.toJson(result); 
 
    }; 
 
    
 
    function initializeRequestStatus() { 
 
     angular.forEach($scope.requests, request => { 
 
      request.statusList = angular.copy($scope.statusList); 
 
     }) 
 
     }; 
 

 
     initializeRequestStatus(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!DOCTYPE html> 
 
<html ng-app='demo'> 
 

 
    <head> 
 
    <script data-require="[email protected]" data-semver="1.1.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
<div class="container" ng-controller="myController"> 
 
    <div> 
 
     
 
     <ul ng-repeat="request in requests"> 
 
      {{request.name}} 
 
      <li> 
 
       <select class="form-control" ng-click="getParent($index, request.selectedStatus)" ng-options="status as status.name for status in request.statusList" ng-model="request.selectedStatus" multiple></select> 
 
      </li> 
 
     </ul> 
 
     
 
     <ul> 
 
      <li ng-repeat="request in requests">{{request.selectedStatus}}</li> 
 
     </ul> 
 
    </div> 
 
</div> 
 
</body> 
 
</html>

來源

2017-10-09 20:53:54

如何推動家長細節與各自選擇的孩子得到JSON作爲輸出我的問題 –

@RaaZuSaH結果JSON是給其父母與孩子選擇。請參閱我的flunker我在json中返回了outpur。 http://plnkr.co/edit/9ZKjrDC0tjlLcfpRGy9w?p=preview –

我已經提到的問題輸出應該在JSON與父母和孩子的細節。父（請求）和孩子（statusList） –

嵌套Dropdown- NG選項裏面NG-重演angularjs

回答

相關問題