Form with data from API

Hi all

I am trying to create a form that has both user input data and data coming from an API.

Example: the user selects a product from a list. the price of the product comes from an API. How can I use this value in my form? It is not in an “input” field, I can just put a “span” around it, but ng-model doesn’t help me in this case. Or does it?

I’ve tried a lot of strategies and I still can’t find the solution. Probably is something really simple that I’ve missed. Any help will be greatly appreciated!

This is crazy but have you just tried using basic Angular way of displaying data like {{scopeVar}}?

Thank you for your answer

My problem is not to show the result of the call to the API, my problem is to “collect” this data and send it to the server. My first idea was to create a form and to collect all data from that form and send it away, and this works great with “input” or “textarea” data (using ng-model). Probably I have to collect other type of data that is part of my form (that is selected and edited by the user using API-calls, not input fields) using scope variables, not ng-model. Is this what are you trying to say?

Why you dont use a input[type=“hidden”] with ng-value=“scopeVar” to send the form?

P.D: input[type=“hidden”] cant use ng-model

So basically you have some data to send to API that is not user-inputed?

Well you can either do

<form ng-submit="mySubmit()">

and then

$scope.mySubmit = function() {
  $scope.myFromData.customField = "customValue"
  $http.post(url, $scope.myFromData).then(...)
}

Or use transfromRequest on $http or Restangular

1 Like

I’ve used scope variables and it worked just fine. Thank you very much for your answers!