Angularjs take the $Scope and concatenate into a URL

Asked

Viewed 1,474 times

1

app js.

    angular.module("FipeApp", []);

angular.module("FipeApp").controller("FipeAppCtrl", function($scope, $http) {
  $scope.app = "FIPE APP";
  $scope.tipos = [{
    nome: "Carros",
    id: "carros"
  }, {
    nome: "Motos",
    id: "motos"
  }, {
    nome: "Caminhões",
    id: "caminhoes"
  }, ];

  //$scope.tipo = [];
  $scope.tipoSelec = '';

  //$scope.marca = [];
  //$scope.marcaSelec = '';

  var carregarMarcas = function() {
    $http.get('https://crossorigin.me/http://fipeapi.appspot.com/api/1/' + $scope.tipoSelec + '/marcas.json').success(function(data) {
      $scope.marcas = data;
    }).error(function(data, status) {
      $scope.message = "Aconteceu um problema: " + data;
    });
  };

  carregarMarcas();

});

index.html

<html lang="pt-BR" ng-app="FipeApp">
<body ng-controller="FipeAppCtrl">
  <div class="container">
    <div class="linha">
      <div class="coluna-5">
        <h4 class="header">{{app}}</h4>
        <select ng-model="tipoSelec" ng-change="carregarMarcas()" ng-options="tipo.nome for tipo in tipos">
          <option value="">Seleciona um Tipo de Veiculo</option>
        </select>
        <select ng-model="marcaSelec" ng-disabled="!tipoSelec" ng-options="marca.fipe_name for marca in marcas">
          <option value="">Seleciona uma Marca</option>
        </select>
        {{tipoSelec.id}} {{marcaSelec.id}}
      </div>
    </div>
  </div>
</body>

I need to get the typeSelec.id selected by the client and concatenate in the URL that will catch the JSON with the name of the Brands, tried in several ways already and nda, am Noob yet =)

CODEPEN HERE

angularjs scope
  • 1

    Is that what you want? http://codepen.io/anon/pen/NGVrbj

  • that’s right, I just had to adjust the ng-click function! thanks

1 answer

2


Change var carregarMarcas = function() for $scope.carregarMarcas

$scope.carregarMarcas = function() {
    $http.get('https://crossorigin.me/http://fipeapi.appspot.com/api/1/' + $scope.tipoSelec.id + '/marcas.json').success(function(data) {
      $scope.marcas = data;
    }).error(function(data, status) {
      $scope.message = "Aconteceu um problema: " + data;
    });
};

  $scope.carregarMarcas();

Working example: http://codepen.io/anon/pen/NGVrbj

  • Just had to adjust the ng-click I will continue the project.

Browser other questions tagged angularjs scope

You are not signed in. Login or sign up in order to post.