Html 如何传递Json值并获取各自的数据

我在我的项目中使用Django。我有一个resources.pyJSON文件，其中包含数据库中所有必需的数据

我有一个html文件，其中包括几个下拉按钮，我的目标是一旦我选择一个下拉选项，它将通过该值，并获得连续的下拉按钮动态值

我的HTML：

<div class="wall" ng-controller="LayerCtrl" >
    <table>
        <tr>
            <td>
                <div class="input-group">
                    <span class="input-group-addon">Fab</span>
                    <select class="form-control" name="fab">
                        {% for f in fab %}
                        <option value="{{f}}">{{f}}</option>
                        {% endfor %}
                    </select>
                </div>
            </td>

            <td>
                <div class="input-group">
                    <span class="input-group-addon">Technode</span>
                    <select class="form-control" ng-model="selected_technode" ng-options="l.value as l.label for l in technodes"></select>
                </div>
            </td>

            <td>
                <div class="input-group">
                    <span class="input-group-addon">Layer</span>
                    <!--<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">-->
                    {%verbatim%}
                    <!--<select class="form-control"  name="layer" >-->
                        <!--<option ng-repeat="l in layer_list" value="{{l}}">{{l}}</option>-->
                    <!--</select>-->
                    <select class="form-control" ng-model="selected_layer" ng-options="l as l for l in layerlist"></select>
                    {%endverbatim%}
                </div>
            </td>
        </tr>
    </table>
        </div>

还有我的JS：

{{ ngapp }}.controller("LayerCtrl", function ($scope, $http, $resource){

var layerresource_url = $resource("{% url 'api_dispatch_list' 'v1' 'layer' %}");

$scope.technodes = [
    {'value': 22, 'label': 22},
    {'value': 28, 'label': 28},
];

console.log('initializing....')

$scope.$watch('selected_technode', function () {
    <!--alert($scope.selected_technode);-->
    $scope.update_layer();
});

$scope.update_layer = function(){;
      console.log('Stage1: Initializing Primary Data... ');
      layerresource_url.get({techtype__contains: $scope.selected_technode, limit:1500},
          function(data){
            $scope.layerlist = data['objects'][0]['layer'];
            console.log($scope.layerlist);
          },function(data, status){
            console.log('Stage1: Internal error while loading initial data:'+status );
            alert('internal error');
          }
      );
    };
});

我需要传递从technode下拉按钮获取的值，并在lalyer下拉框中显示相应的结果。我该怎么做？提前谢谢

编辑

---

现在我在JS文件中硬编码了这些选项。但是我需要用python的方式替换这个选项，就像我得到晶圆厂一样。如何做到这一点？

选择字段的用法是：

<select
  ng-model="string"
  [name="string"]
  [required="string"]
  [ng-required="string"]
  [ng-change="string"]
  [ng-options="string"]>
...
</select>

---

斯米格尔，谢谢你的回答，但它似乎不起作用。。JS modified:{{ngapp}.controllerLayerCtrl，函数$scope，$http，$resource{layerresource\u url={%url'api\u dispatch\u list''v1''层'%}；var m=$resourcelayerresource\u url；m.getfunctiondata{$scope.layer=data.objects[0]；}；$scope.$watch selected'technode'，函数newVal{updateLayernewVal；}；函数updateLayerdata{var m=$resourcelayerresource_url；m.getfunctiondata{$scope.layer=data.objects[0]；}}；}；我不知道到底出了什么问题。我认为get语句也出了问题，我试图对其进行更改。能否直接在代码中加载资源？我在浏览器中使用了以下内容，并且可以正常工作。http://xxxxxxx/layer/?format=json&techtype__contains=28 我想通过28级考试，获得与该技术相关的图层我再次更改了它。所以var数据应该包含相同的结果。Smiggle，我以前尝试过。但返回了一个错误作为错误：$injector:nomod Module Unavailable我只是根据您的答案编辑JS文件

<select class="form-control" ng-model="selected_technode" name="technode">
                {% for t in technode %}
                <option  value="{{f}}">{{t}}</option>
                {% endfor %}
            </select>

$scope.$watch('selected_technode', function (newVal) {
    updateLayer(newVal);
});

function updateLayer(technode) {
    var m = $resource(layerresource_url);
    var data = m.get({format: json, techtype__contains: technode});
    $scope.layer = data.objects[0];
}