Ionic AngularJS 范围数据值到 HTML post

Question

我正在使用 AngularJS v1 开发 Ionic creator，以构建报价计算器。如果用户选择切换、范围等，所有字段都有默认值“0”。值会更改并显示正确的值，但是当我尝试发送绑定值时，我得到默认值“0” “ 这是项目的测试URL：https://creator.ionic.io/share/html/2d9b0126751e#/menu/disenoweb

我使用的代码：

 function ($scope, $http, $stateParams) {

    $scope.seos = [
        { 'value' : 0,
        'label' : "Número palabras"
        },
        { 'value' : 200,
        'label' : "5 palabras clave"
        },
        { 'value' : 400,
        'label' : "10 palabras clave"
        },
         { 'value' : 800,
        'label' : "20 palabras clave"
        }
        ];

    $scope.accesos = [
        { 

        'value' : 0,
        'label' : "Opciones"


        },
        { 'value' : 200,
        'label' : "Con panel de usuario"

        },
        { 'value' : 50,
        'label' : "Sin panel de usuario"

        }
        ];

    $scope.data = {
        'dominio' : 0,
        'alojamiento' : 0,
        'logotipo' : 0,
        'pagespeed' : 0,
        'secciones' : 3,
        'galerias' : 0,
        'formularios' : 0,
        'blogintegrado' : 0,
        'catent' : 0,
        'categoriasblog' : 0,
        'entradasblog' : 0,
        'forointegrado' : 0,
        'seccionestotal' : 0,
        'entradasforo' : 0,
        'categoriasforo' : 0,
        'mapa' : 0,
        'soporte' : 0,
        'login' : 0,
        'descargadocumentos' : 0,
        'hstienda' : 0,
        'tiendaint' : 0,
        'cattien' : 0,
        'prodtien' : 0,
        'seo' : $scope.seos[0].value,
        'acceso' : $scope.accesos[0].value,
        'total' : 0
    };
    $scope.showdiana = function(){
             $scope.show=true;
           };

    $scope.showemail = function(){
             $scope.show=true;
           };

    $scope.reset = function () {
            $scope.data = {
                 'dominio' : 0,
        'alojamiento' : 0,
        'logotipo' : 0,
        'pagespeed' : 0,
        'secciones' : 3,
        'galerias' : 0,
        'formularios' : 0,
        'blogintegrado' : 0,
        'catent' : 0,
        'categoriasblog' : 0,
        'entradasblog' : 0,
        'forointegrado' : 0,
        'seccionestotal' : 0,
        'entradasforo' : 0,
        'categoriasforo' : 0,
        'mapa' : 0,
        'soporte' : 0,
        'login' : 0,
        'descargadocumentos' : 0,
        'hstienda' : 0,
        'tiendaint' : 0,
        'cattien' : 0,
        'prodtien' : 0,
        'seo' : $scope.seos[0].value,
        'acceso' : $scope.accesos[0].value,
        'total' : 0
            };

        };


    $scope.resetblog = function() {

            if($scope.data.entradasblog > 0) {
                  $scope.data.entradasblog = '0';}

            else if ($scope.data.categoriasblog > 0) {
                  $scope.data.categoriasblog = '0';}
         };

    $scope.resetforo = function() {

            if($scope.data.entradasforo > 0) {
                 $scope.data.entradasforo = '0';  }

            else if($scope.data.categoriasforo > 0){
                  $scope.data.categoriasforo = '0';}

        };



        var mailgunUrl = "mydomain.com";
        var mailgunApiKey = window.btoa("api:key-mykey");
        var recipient = "myemail";
        var subject = "Quote";
        var message = "Test value: " + $scope.data.dominio;

        $scope.send = function()
        {
            $http(

                { 
                    "method": "POST",
                    "url": "https://api.mailgun.net/v3/" + mailgunUrl + "/messages",
                    "headers": {
                        "Content-Type": "application/x-www-form-urlencoded",
                        "Authorization": "Basic " + mailgunApiKey
                    },
                    data: "from=" + "app@pixeldraw.eu" + "&to=" + recipient + "&subject=" + subject + "&html=" +  message
                }
            ).then(function(success) {
                console.log("SUCCESS " + JSON.stringify(success));
            }, function(error) {
                console.log("ERROR " + JSON.stringify(error));
            });
        };

    }

我是 AngularJS/Ionic 新手，如有任何帮助，我们将不胜感激。谢谢

Answer 1

我不会写你所有的代码，但这个工作

<label class="toggle toggle-assertive">
   <input ng-model="data.dominio" type="checkbox" ng-true-value="10" ng-false-value="0">
   <div class="track">
     <div class="handle"></div>
   </div>
 </label>

控制器：

$scope.send = function(){
    var dominio = Number($scope.data.dominio);
    console.log(dominio);
}

Codepen

在你问我的情况下

<select name="seos" id="seos" ng-model="data.seos">
  <option ng-repeat="option in seos" value="{{option.value}}">{{option.label}}</option>
</select>
<button ng-click="send()">hola</button

控制器：

$scope.seos = [
    { 'value' : 0,
    'label' : "Número palabras"
    },
    { 'value' : 200,
    'label' : "5 palabras clave"
    },
    { 'value' : 400,
    'label' : "10 palabras clave"
    },
     { 'value' : 800,
    'label' : "20 palabras clave"
    }
    ];
$scope.send = function(){
  console.log($scope.data.seos)
}

Ionic AngularJS 范围数据值到 HTML post

Ionic AngularJS scope data value to HTML post

javascript

angularjs

mailgun

ionic-framework