<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="SeguroController">
<form>
<fieldset>
<legend>Seguro Médico</legend>
<label for="nif">NIF:</label><input id="nif" name="nif" type="text" ng-model="seguro.nif" /><br>
<label for="nombre">Nombre:</label><input id="nombre" name="nombre" type="text" ng-model="seguro.nombre" /><br>
<label for="ape1">1º Apellido:</label><input id="ape1" name="ape1" type="text" ng-model="seguro.ape1" /><br>
<label for="edad">Edad:</label><input id="edad" name="edad" type="text" ng-model="seguro.edad" /><br>
<label for="sexo">Sexo:</label><select id="sexo" name="sexo" type="checkbox" ng-model="seguro.sexo" ><option value="">--Elige opcion--</option><option value="H">Hombre</option><option value="M">Mujer</option></select><br>
<label for="casado">Casado:</label><input id="casado" name="casado" type="checkbox" ng-model="seguro.casado" /><br>
<label for="numHijos">Nº Hijos:</label><input id="numHijos" name="numHijos" type="text" ng-model="seguro.numHijos" /><br>
<label for="embarazada">Embarazada:</label><input id="embarazada" name="embarazada" type="checkbox" ng-model="seguro.embarazada" /><br>
<label for="fechaCreacion">Fecha de creación:</label><input id="fechaCreacion" name="fechaCreacion" type="text" ng-model="seguro.fechaCreacion" /><br>
</fieldset>
<fieldset>
<legend>Coberturas</legend>
<label for="oftalmologia">Oftalmologia:</label><input id="oftalmologia" name="oftalmologia" type="checkbox" ng-model="seguro.coberturas.oftalmologia" /><br>
<label for="dental">Dental:</label><input id="dental" name="dental" type="checkbox" ng-model="seguro.coberturas.dental" /><br>
<label ng-show="seguro.sexo==='M'" for="fecundacionInVitro">Fecundacion In Vitro:</label><input ng-show="seguro.sexo==='M'" id="fecundacionInVitro" name="fecundacionInVitro" type="checkbox" ng-model="seguro.coberturas.fecundacionInVitro" /><br>
</fieldset>
<fieldset>
<legend>Enfermedades</legend>
<label for="corazon">Corazon:</label><input id="corazon" name="corazon" type="checkbox" ng-model="seguro.enfermedades.corazon" /><br>
<label for="estomacal">Estomacal:</label><input id="estomacal" name="estomacal" type="checkbox" ng-model="seguro.enfermedades.estomacal" /><br>
<label for="rinyones">Riñones:</label><input id="rinyones" name="rinyones" type="checkbox" ng-model="seguro.enfermedades.rinyones" /><br>
<label for="alergia">Alergia:</label><input id="alergia" name="alergia" type="checkbox" ng-model="seguro.enfermedades.alergia" /><br>
<label for="nombreAlergia">Nombre de la alergia:</label><input ng-disabled="seguro.enfermedades.alergia===false" id="nombreAlergia" name="nombreAlergia" type="text" ng-model="seguro.enfermedades.nombreAlergia" /><br>
</fieldset>
</form>
</body>
</html>
var app=angular.module("app",[]);
app.controller("SeguroController",['$scope','$log','$http',function($scope,$log,$http) {
$scope.seguro={
nif:"",
nombre:"",
ape1:"",
edad:undefined,
sexo:"",
casado:false,
numHijos:undefined,
embarazada:false,
coberturas: {
oftalmologia:false,
dental:false,
fecundacionInVitro:false
},
enfermedades:{
corazon:false,
estomacal:false,
rinyones:false,
alergia:false,
nombreAlergia:""
},
fechaCreacion:new Date()
}
$log.debug("Acabamos de crear el $scope");
$http({
method: 'GET',
url: 'datos.json'
}).success(function(data, status, headers, config) {
$scope.seguro=data;
}).error(function(data, status, headers, config) {
alert("Ha fallado la petición. Estado HTTP:"+status);
});
}]);
Ejemplo de uso de $http
{
"nif":"12345678Z",
"nombre":"Carlos",
"ape1":"Cano",
"edad":41,
"sexo":"H",
"casado":true,
"numHijos":3,
"embarazada":false,
"coberturas": {
"oftalmologia":true,
"dental":false,
"fecundacionInVitro":false
},
"enfermedades":{
"corazon":true,
"estomacal":false,
"rinyones":false,
"alergia":true,
"nombreAlergia":"Acaros"
}
}