AngularJs集团和Fill Comboboxes

Question

我有这样的Json数据；

This XML file does not appear to have any style information associated with it. The document tree is shown below.

{"Kod":16105，"TapuKod":9469416，"ParselNo":"48"，"AdaNo":"125"，"MahalleId":146436，"Record":null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16106，"TapuKod":9469417，"ParselNo":"49"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16107，"TapuKod":9469187，"ParselNo":"5"，"AdaNo":"125"，"MahalleId":146436，"Record":null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16108，TapuKod:9469418，"ParselNo":"50"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，“编辑”：null，"EditDate":null}，{"Kod":16109，"TapuKod":9469426，"ParselNo":"51"，"AdaNo":"125"，"MahalleId":146436，“MahalleId”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16110，"TapuKod":9469610，"ParselNo":"53"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16111，"TapuKod":9469615，"ParselNo":"54"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16112，"TapuKod":9469188，"ParselNo":"6"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，"EditDate":null}，{"Kod":16113，"TapuKod":9469189，"ParselNo":"7"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16114，TapuKod:9469190，"ParselNo":"8"，"AdaNo":"125"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16115，"TapuKod":9469191，"ParselNo":"9"，"AdaNo":"125"，"MahalleId":146436，“null”，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16116，"TapuKod":9468741，"ParselNo":"2"，"AdaNo":"126"，"MahalleId":146436，“记录”：null，"RecordDate":null，“编辑”：null，"EditDate":null}，{"Kod":16117，"TapuKod":9468742，"ParselNo":"1"，"AdaNo":"127"，"MahalleId":146436，“记录”：null，"RecordDate":null，“编辑”：null，"EditDate":null}，{"Kod":16118，"TapuKod":9468745，"ParselNo":"1"，"AdaNo":"128"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16119，"TapuKod":9468748，"ParselNo":"2"，"AdaNo":"128"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16120，"TapuKod":9468933，"ParselNo":"3"，"AdaNo":"128"，"MahalleId":146436，"Record":null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16121，"TapuKod":9623908，"ParselNo":"4"，"AdaNo":"128"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16122，"TapuKod":9623909，"ParselNo":"5"，"AdaNo":"128"，"MahalleId":146436，"Record":null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16123，"TapuKod":9468950，"ParselNo":"6"，"AdaNo":"128"，"MahalleId":146436，“记录”：null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16124，"TapuKod":9695996，"ParselNo":"7"，"AdaNo":"128"，"MahalleId":146436，"Record":null，"RecordDate":null，"Edit":null，"EditDate":null}，{"Kod":16125，TapuKod:9693613，"ParselNo":"1"，"AdaNo":"129"，"MahalleId":146436，"Record":null，"RecordDate":null，“编辑”：null，"EditDate":null}，{"Kod":16126，"TapuKod":9470332，"ParselNo":"1"，"AdaNo":"130"，"MahalleId":146436，“MahalleId”：null，"RecordDate":null，“RecordDate”：null，"Edit":null，"EditDate":null}，{"Kod":16127，"TapuKod":9468983，"ParselNo":"10"，"AdaNo":"130"，"MahalleId":146436，“记录”：null，"RecordDate":null，“编辑”：null，"EditDate":null}

有两个像这样的组合框；

这里

我想用AdaNo ComboBox填充AdaNo，但不想重复同样的不。然后，当我选择任何一个AdaNo时，它将用ParselNo填充parselNo组合框，哪个AdaNo=selectedAdaNo。

我的ApiController：

 public string GetParselFromMahalleKod(int id)
    {


        List<TapuParselModel> parselList = TapuModule.GetParselListFromMahalleTapuKod(id);



        string jsonResult = SConvert.SerializeJSON(parselList);
        return jsonResult;
    }

在tapuController.js中；

 $scope.getParsels = function () {
        TapuParselApi.all($scope.selectedMahalle).success(function (response) {
            $scope.Parseller = angular.fromJson(response);
        })

像这样的索引；

 <div>
            Ada No:<select data-ng-model="adaNo">
                <option value="{{parsel.AdaNo}}" data-ng-repeat="parsel in Parseller">{{parsel.AdaNo}}</option>
            </select>
            Parsel No:<select data-ng-model="parselNo">
                <option value="{{parsel.ParselNo}}" data-ng-repeat="parsel in Parseller">{{parsel.ParselNo}}</option>
            </select>
            <button data-ng-click="downloadZeminsFromZeminArg()">Sorgula</button>
        </div>

我能用一个Json吗？注意:我用的是angularJs。因此，也许有一种角的方法:)

我该怎么办？

Answer 1

请参阅下面的工作代码，您可以在这里找到您的解决方案。

<html ng-app="app">
<head>
    <title>Index</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-controller="ctrl">
    <table>
        <tr>
            <td>Ada No:</td>
            <td>
                <select ng-model="AdaNos" ng-options="item.AdaNo for item in items | unique:'AdaNo'">
                </select>               
            </td>
        </tr>
        <tr>
            <td>Parsel No:</td>
            <td>
                <select ng-model="ParselNos" ng-options="item.ParselNo for item in items | filter:AdaNos.AdaNo:true" | unique:'ParselNo'>
                </select>               
            </td>
        </tr>   
    </table>

    <script>

        var app = angular.module("app", []).controller("ctrl", function($scope){
            var data = [{"Kod":16105,"TapuKod":9469416,"ParselNo":"48","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16106,"TapuKod":9469417,"ParselNo":"49","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16107,"TapuKod":9469187,"ParselNo":"5","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16108,"TapuKod":9469418,"ParselNo":"50","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16109,"TapuKod":9469426,"ParselNo":"51","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16110,"TapuKod":9469610,"ParselNo":"53","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16111,"TapuKod":9469615,"ParselNo":"54","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16112,"TapuKod":9469188,"ParselNo":"6","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16113,"TapuKod":9469189,"ParselNo":"7","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16114,"TapuKod":9469190,"ParselNo":"8","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16115,"TapuKod":9469191,"ParselNo":"9","AdaNo":"125","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16116,"TapuKod":9468741,"ParselNo":"2","AdaNo":"126","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16117,"TapuKod":9468742,"ParselNo":"1","AdaNo":"127","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16118,"TapuKod":9468745,"ParselNo":"1","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16119,"TapuKod":9468748,"ParselNo":"2","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16120,"TapuKod":9468933,"ParselNo":"3","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16121,"TapuKod":9623908,"ParselNo":"4","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16122,"TapuKod":9623909,"ParselNo":"5","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16123,"TapuKod":9468950,"ParselNo":"6","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16124,"TapuKod":9695996,"ParselNo":"7","AdaNo":"128","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16125,"TapuKod":9693613,"ParselNo":"1","AdaNo":"129","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16126,"TapuKod":9470332,"ParselNo":"1","AdaNo":"130","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},{"Kod":16127,"TapuKod":9468983,"ParselNo":"10","AdaNo":"130","MahalleId":146436,"Record":null,"RecordDate":null,"Edit":null,"EditDate":null},]
            $scope.items = data;
        });

        app.filter('unique', function() {
           return function(collection, keyname) {
              var output = [], 
                  keys = [];

              angular.forEach(collection, function(item) {
                  var key = item[keyname];
                  if(keys.indexOf(key) === -1) {
                      keys.push(key);
                      output.push(item);
                  }
              });

              return output;
           };
        });

    </script>
</body>
</html>