Estimados, estoy utilizando $transitions
para identificar desde que $state
se esta llegando a uno determinado.
$transitions.onSuccess({ from: 'trabajos/nuevo_trabajo' }, (trans) => {
cargarDatos();
});
var cargarDatos = function(){
nuevoVehiculo = angular.fromJson(SessionFactory.getDataByKey('nuevoVehiculo'));
if (nuevoVehiculo) {
$scope.data.nombre_cliente = nuevoVehiculo.nombre_cliente;
$scope.data.patente = nuevoVehiculo.patente;
$scope.data.anio = nuevoVehiculo.anio;
$scope.data.kilometros = nuevoVehiculo.kilometros;
$scope.data.marca = nuevoVehiculo.marca;
$scope.data.modelo = nuevoVehiculo.modelo;
$scope.data.cilindrada = nuevoVehiculo.cilindrada;
$scope.data.telefono = nuevoVehiculo.telefono_cliente;
}
console.log($scope.data);
}
HTML:
<form name="nuevoVehiculoForm" data-ng-submit="nuevoVehiculo()">
<div layout layout-sm="column">
<md-input-container flex class="input-form-custom">
<label>Patente</label>
<input required name="patente" ng-model="data.patente" ng-pattern="/^((([a-z]|[A-Z]){2}[0-9]{4})|(([a-z]|[A-Z]){4}[0-9]{2}))$/" maxlength="6">
<div ng-messages="nuevoVehiculoForm.patente.$error">
<div ng-message="required">Patente es obligatoria.</div>
<div ng-message="pattern">Patente inválida.</div>
</div>
</md-input-container>
<md-input-container flex class="input-form-custom">
<label>Año</label>
<input required name="anio" ng-model="data.anio" type="number">
<div ng-messages="nuevoVehiculoForm.anio.$error">
<div ng-message="required">Debe ingresar un Año.</div>
</div>
</md-input-container>
<md-input-container flex class="input-form-custom">
<label>KM</label>
<input required name="kilometros" ng-model="data.kilometros" type="number">
<div ng-messages="nuevoVehiculoForm.kilometros.$error">
<div ng-message="required">Debe ingresar un Kilometraje.</div>
</div>
</md-input-container>
</div>
<div layout layout-sm="column">
<md-input-container flex class="input-form-custom">
<label>Marca</label>
<input required name="marca" ng-model="data.marca">
<div ng-messages="nuevoVehiculoForm.marca.$error">
<div ng-message="required">Debe ingresar Marca.</div>
</div>
</md-input-container>
<md-input-container flex class="input-form-custom">
<label>Modelo</label>
<input required name="modelo" ng-model="data.modelo" type="text">
<div ng-messages="nuevoVehiculoForm.modelo.$error">
<div ng-message="required">Debe ingresar Modelo.</div>
</div>
</md-input-container>
<md-input-container flex class="input-form-custom">
<label>Cilindrada</label>
<input required name="cilindrada" ng-model="data.cilindrada" type="number">
<div ng-messages="nuevoVehiculoForm.cilindrada.$error">
<div ng-message="required">Debe ingresar Cilindrada</div>
</div>
</md-input-container>
</div>
<div layout layout-sm="column">
<md-input-container flex class="input-form-custom">
<label>Nombre completo</label>
<input type="text" required name="nombre_cliente" ng-model="data.nombre_cliente" columns="1" md-maxlength="150"></input>
<div ng-messages="nuevoVehiculoForm.nombre_cliente.$error">
<div ng-message="required">Nombre completo es obligatorio.</div>
</div>
</md-input-container>
<md-input-container flex class="input-form-custom">
<label>Telefono</label>
<input ng-pattern="/^([0-9]*)?$/" minlength="11" maxlength="11" required name="telefono" ng-model="data.telefono" type="text">
<div ng-messages="nuevoVehiculoForm.telefono.$error">
<div ng-message="required">Teléfono es obligatorio</div>
<div ng-message="minlength">Teléfono debe tener 11 caracteres.</div>
<div ng-message="maxlength">Teléfono debe tener 11 caracteres.</div>
<div ng-message="pattern">Teléfono debe ser numérico</div>
</div>
</md-input-container>
</div>
<center>
<button ng-disabled="!canSubmit()" type="button" class="btn btn-success" ng-click="ingresarNuevoVehiculo()">Ingresar</button>
</center>
</form>
La impresión de $scope.data
me refleja los cambios y actualiza el modelo. Sin embargo, en el codigo HTML no se ve reflejado el cambio. No se porque no se actualiza.
EDICION
Logre hacer funcionar el stateChangeSuccess
pero aun asi, el modelo no se actualiza. Me parece que el problema no pasa por eso, agregue codigo html.
<script src="https://unpkg.com/@uirouter/[email protected]/release/angular-ui-router.min.js"></script>
<script src="bower_components/angular-ui-router/release/stateEvents.min.js"></script>