ngSwitch内的ng-model不起作用

时间:2016-08-19 12:01:00

标签: angularjs json ng-switch

我的表单以JSON格式向服务器发送计算值。 但我无法理解为什么只有ngSwitch内部的ng-model不会发送JSON数组。 我认为ng-model应该使用$ parent在ngSwitch中工作。 但似乎角度仍需要更多东西。

这是我的表格

    <form ng-app="SaunaDoorCalc" ng-controller="SaunaDoorCalcController" class="calculator" name="calculator">

....
<tr><td>Result</td> 
    <td ng-switch-default ng-model="$parent.doorsize">@{{selectedSizeSwitch}}, @{{selectedStandardSize.label}}</td>
    <td ng-switch-when="non-standard" ng-model="$parent.doorsize">@{{selectedSizeSwitch}}, @{{DoorSizeB}}x@{{DoorSizeH}}</td>   
    <td ng-switch-default ng-model="$parent.baseprice">@{{selectedStandardSize.price}}</td>
    <td ng-switch-when="non-standard" ng-model="$parent.baseprice">@{{DoorSizeB*DoorSizeH*5000/1000000}}
    </td>
</tr>

....

</form>

和我的剧本

angular
  .module('SaunaDoorCalc',[])
    .controller('SaunaDoorCalcController', function($scope, $http) {

    $scope.outerScope = {};
    $scope.formData = {};

    .....

    $scope.submit = function(isValid) {
      if (isValid) {
          $http.post($scope.url, 
            {
              "calcname": "saunadoor", 
              "doorsize": $scope.doorsize, 
              "baseprice": $scope.baseprice, 
              "glass": $scope.selectedGlass, 
              "korobka": $scope.selectedKorobka, 
              "petli": $scope.selectedPetli, 
              "dekor": $scope.selectedDekor, 
              "dostavka": $scope.selectedDostavka,
              "montazh": $scope.montazh, 
              "name": $scope.name, 
              "tel": $scope.tel, 
              "email": $scope.email, 
              "msg": $scope.msg, 
            }).
                        success(function(data, status) {
                            console.log(data);
                            $scope.status = status;
                            $scope.data = data;
                            $scope.result = data; 
                        });
              $scope.name = null;
              $scope.tel = null;
              $scope.email = null;
              $scope.msg = null;
              $scope.DoorSizeB = null;
              $scope.DoorSizeH = null;
              $scope.calculator.$setPristine();
              $scope.message = 'Заказ отправлен. В ближайшее время мы с вами свяжемся.'; 

            }else{
              $scope.message = 'Заполните обязательные поля формы!'; 
            }

        }

  });

1 个答案:

答案 0 :(得分:3)

ng-model不会绑定到您应该使用的td元素<{1}}

https://docs.angularjs.org/api/ng/directive/ngModel

  

ngModel指令使用NgModelController将输入,select,textarea(或自定义表单控件)绑定到作用域上的属性,NgModelController由此指令创建并公开。