Save data clicked on a JSON

Question

Save data clicked on a JSON

Navigation

#1 by (0 votes)

0

I am creating a simple application in AngularJS, the application is summarized in 3 pages:

Device: Where the person chooses the device

Plans: Choose the plan related to the device

Final file informing name, email, telephone and etc ...

The list of possible devices and plans for that chosen device comes from a JSON file, which I get through an HTTP request.

The question is: I would like to save this information, when it clicks on a device, then the plan and save and after writing the data save all and exit the final page and console.log , but how do I do this?

This is my file api.js , where I request the devices:

// plataformas 
//arquivo api.js
app.controller('plataformAPI', function($scope, $http){
    $http.get('http://private-59658d-celulardireto2017.apiary-mock.com/plataformas')
    .then(function(response){


          $scope.dados = response.data.plataformas;



    });

});

This is the home.html file where the person chooses the devices:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><divclass="col-xs-12 col-sm-12 col-md-12 col-lg-12"  align="center" ng-controller="plataformAPI">
  <div ng-repeat="x in dados">
    <h1>{{x.nome}}</h1>
    <p>{{x.descricao.replace('|',' ')}}</p>
    <p><a class="btn btn-primary btn-md" href="{{prefix + x.nome}}" role="button">Quero esse</a></p>
  </div>
</div>

I came up with the following schema but it did not work, saved in localstorage as undefined :

    // click event

    $scope.eventos = {};
    $scope.eventos.Clique = function() {
        var nomeAparelho = document.getElementsByClassName('nomeAparelho').value;
        localStorage.setItem("aparelho:", nomeAparelho);
    }

});

http javascript angularjs json

asked by anonymous 22.01.2018 / 20:23

1 answer

Connect Heroku application to an external (Mysql) database How to capture status rendering (pending) to svg not loaded on the screen?

score 0 · Answer 1

A good Angular practice is to leave the Controller just to redirect the content, while your business rule is in a Service (or Factory, whatever). You can create a factory with the objects you want to save (devices, plans, etc) and access them via controller. For example, when you choose the plan, you call (by the controller) a function that will call the function "saveCompare (deviceObj)" of your service.

app.controller('plataformAPI', function($scope, meuService){
/* faz a injeção de dependencia do meuService no controller */

  meuService.exemploDeApi().then(respostaDaFuncaoDoService) {
    $scope.dados = respostaDaFuncaoDoService;
    // qndo houver resposta do $http.get, ele vai retornar a resposta, que será armazenada no $scope.dados (como vc fez o retorno dos aparelhos)

  $scope.escolherAparelho = function(aparelho) {
    meuService.gravarAparelho(aparelho); // armazena o parametro "aparelho" no OBJETO meusDados.aparelho (do service)
  }

  }
    

});

app.factory('meuService', function ($http) {
  
  /* seu objeto */
  var meusDados = {
    'aparelho': null,
    'nomePessoa': null,
    'plano': null
  }

  var _gravarAparelho = function (objetoAparelho) {
    meusDados.aparelho = objetoAparelho;
  }
  
  var _recuperarMeusDados = function () {
    return meusDados;
  }
  
  var _exemploDeAPI = function () {
    return $http.get('http://private-59658d-celulardireto2017.apiary-  mock.com/plataformas');

  return {
    _gravarAparelho: gravarAparelho,
    _recuperarMeusDados: recuperarMeusDados,
    __exemploDeAPI: exemploDeAPI
    /* quando o CONTROLLER chamar "meuService.gravarAparelho()" ele vai entender que 'gravarAparelho' se refere a funçao '_gravarAparelho' (dentro do service)*/
  }
}