¡Buenos días! Estoy comenzando con AngularJS, y tengo un formulario con dos radio button y un botón. Al darle al botón se me muestra otro formulario con el resultado del cálculo del primer formulario. Mi PROBLEMA es que todo se me muestra perfectamente menos los radio button que seleccioné. Tengo dos radio button: crédito hipotecario y crédito personal. Antes de clicar el botón, selecciono el crédito hipotecario y cuando le doy al botón, lo demás, se me muestra perfectamente menos el crédito hipotecario que os acabo de mencionar. Os agradezco de antemano vuestros comentarios y sugerencias.
Os dejo por aqui mi código HTML:
<div class="jumbotron" background-color="#FFF8DC">
<div style="position:center ; color: #1D66EE">
<h1>//ABANCA</h1>
</div>
<p class="lead">
Préstamos en 24H.
Haz tus cuentas.
</p>
</div>
<div class="row" ng-app="formApp" ng-controller="formAppCtrl">
<div class="col-md-6">
<form action="http://localhost:58498/api/Cuota" class="form-horizontal"
method="get" role="form" id="formulario-cuotas">
<div class="form-group">
<label class="control-label" for="Cuotas">¿Cuánto quieres pedir?</label>
<input class="form-control" data-val="true"
data-val-cuotas="El campo de las Cuotas está vacío. No es válido"
data-val-required="El campo Cuotas es obligatorio." id="Cuotas"
name="cantidad" type="number" value=""
ng-model="formulario.cantidad">
<span class="field-validation-valid text--danger"
data-valmsg-for="Cuotas" data-valmsg-replace="true"></span>
</div>
<p>
"Con el préstamo 24h puedes pedir a partir <br>
de 500€, pero para cantidades de hasta 3000€ <br>
tiene que ser en la "<a href="/es/tarjetas/tarjetas-credito/tarjeta-visa-clip" target="_blank">
modalidad de
tarjeta <br>
</a>
".Por eso este simulador empieza en 3000€ que <br>
es lo mínimo que puedes pedir en la modalidad <br>
de préstamo. Ten en cuenta que no puedes <br>
solicitar más de lo que cuesta lo que vayas <br>
financiar."
</p>
<br>
<div class="form-group">
<label for="Plazo" class="control-label">¿Cuándo deseas devolverlo?</label>
<input class="form-control" data-val="true"
data-val-cuotas="El campo de los plazos está vacío. No es válido"
data-val-required="El campo Plazos es obligatorio." id="Plazos"
name="plazos" type="text" value=""
ng-model="formulario.plazos">
<span class="field-validation-valid text--danger"
data-valmsg-for="Plazos" data-valmsg-replace="true"></span>
</div>
<p>
"Puedes devolverlo en un plazo maximo de 96 meses,<br>
osea, 8 años"
</p>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="tipo" id="optionsRadios1" value="hipotecario"><font>
<font class="">
Crédito Hipotecario.
</font>
</font>
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="tipo" id="optionsRadios2" value="personal" checked=""><font>
<font class="">
Crédito Personal.
</font>
</font>
</label>
</div>
<br>
<br>
</form>
<button id="btnenviar" name="btnenviar" class="btn btn-primary input-group">
ENVIAR
</button>
<br>
<div>
<div>
<button ng-click="myForm()">
NG-ENVIAR
</button>
</div>
</div>
</div>
<div class="col-md-6">
<div ng-show="showMe">
<form method="get" action="http://localhost:58498" class="form-horizontal" role="form" id="respuestaform">
<br>
<br><h3>Resultado:</h3>
<div id="resultado"></div>
<h4>Cantidad</h4>
<div>{{contenedor.cantidad}}</div>
<h4>Cuota</h4>
<div>{{contenedor.cuota}}</div>
<h4>Plazos</h4>
<div>{{contenedor.plazos}}</div>
<h4>Tipo</h4>
<div>{{contenedor.tipo}}</div>
</form>
</div>
</div>
</div>
@*</div>*@
<!-- /ko -->
Añado el controlador:
angular.module('formApp', [])
.controller('formAppCtrl', function ($scope, $http) {
$scope.contenedor = {};
$scope.contenedor.cantidad = "";
$scope.contenedor.cuota = "";
$scope.contenedor.plazos = "";
$scope.contenedor.tipo ="";
$scope.formulario = {}
$scope.formulario.cantidad = 0;
$scope.formulario.plazos = 0;
$scope.formulario.tipo = "";
var logresultado = function (respuesta) {
$scope.contenedor.cantidad = respuesta.cantidad;
$scope.contenedor.cuota = respuesta.cuota;
$scope.contenedor.plazos = respuesta.plazos
$scope.contenedor.tipo = respuesta.tipo;
};
$scope.showMe = false;
$scope.myForm = function () {
var baseURL = 'http://localhost:58498/api/cuota?';
var cantidad = 'cantidad=' + $scope.formulario.cantidad;
var plazos = '&plazos=' + $scope.formulario.plazos;
var tipo = '&tipo=' + $scope.formulario.tipo;
$http.get(baseURL+cantidad+plazos+tipo).success(function (respuesta) {
console.log(respuesta)
logresultado(respuesta);
console.log('entra aqui')
$scope.showMe = !$scope.showMe;
})
}
});