How to pass input data dynamically inside Angular Library? - javascript

I have to take input from the user and then pass it to API endpoint which is in services section but the services section has to converted into a library. So how can achieve this data transfer without updating the library or putting hardcoded values inside it again and again?

try using type any for the input data in the service library. this is how you will be able to pass any data type the api would receive. Even if the api request data type changes, you don't have to change the service input data type.

Related

Make a GET request to a JSON file URL and store the response so it can be used globally on Vue.js application start?

Imagine the following scenario - I have a Vue.js component and I am trying to display the name of a user, however, I only have the ID of that user. I also have a JSON file URL that contains all user objects and each object contains the name and ID of the user. This way I could find the name of the user based on his ID.
Currently, I make a GET request for that JSON file when the Vue.js component is mounted and store the response when the GET request goes through. After that I can use the function which returns me the name of the user based on his ID.
Now the problems I have with this way of doing it is that:
I make a GET request to the JSON file URL every time the component is reloaded
I can only access the response from the GET request inside this component only. I will need to have access to the same JSON from different components as well and right now I'd have to make GET requests to the same JSON file from the different components which seems incorrect to me
I assume storing the JSON response in VUEX would be a good idea because I'd be able to access it from anywhere, however, I'm not sure from where should I make the GET request to the JSON file in this case.
Is there a place in Vue.js where I can put the GET request so that it gets executed every time the Vue.js application is started but no more than once?
You're right - Vuex is the way to go to solve this problem.
Assuming you're working in a vue-cli project, you can make that initial request in either
main.js
App.vue (Top level component, inside the created hook)
Either work, just make sure you commit the user info to Vuex after making the call.
I would recommend using App.vue because you could setup a spinner/loading icon while the user data is being loaded to show the user is app is 'doing something' if it takes a long time to load.

How to bind the Stored Annotation for pdf

I am using annotator.js to annotate my PDF documents. I am able to save it to my SQL database and retrieve it. But I am not sure how to Bind back the data on to the specific page. I am using Pure HTML, JQuery for the AnnotatorJS API calls and REST web service to send and receive data in JSON format.
My problem is what are the steps required to use the retrieved data from my SQL database and bind it on to the PDF.
Any suggestions?
I had similar problem before. Try this code. You can change your code accordingly
var subscription= $('#content').annotator();
subscription.data('annotator').plugins['Store'].loadAnnotationsFromSearch().then(function(res) {
subscription.annotator('loadAnnotations', res.rows); res.rows /// in my case
});

How to submit test data and post requests between views in Angular?

I have a theory as to how to approach them, and was looking for some guidance on how to solve this problem and see if I am on the right path, because I am not sure.
I have a web app for a project I am building, and I have a database that I need to query for specific information. I have a search button that is attached to a function in my MainController, and I need to have my data passed on to my result.html file, which displays information from a ResultsController.
This is my theory for how to get this working using fake data, and an html request (which uses promises I imagine?)
for fake/test data, I stored an array with objects that represents JSON data in my services file that was basically the parent to ResultsController and MainController, and ResultsController would take in that information and display it on the screen.
For querying a database, my search function would search the database, and fill/replace the array in my services file with additional information. By virtue of changing that array of objects in my services, my results.html should pull down new data automatically when I click search, since the ResultsController has access to that same JSON data. (also, clicking search submits the query and then does $location.path("/results") after to get to the results page).
For querying a database and dynamically changing the information on a page, are these the right steps to submitting a request to a database in pulling information down upon each "search" request?
You are on the right track in using a service to share logic and data between the two controllers. This is generally seen as best practice - and it is better than the approach that is sometimes used of putting the logic and data in a parent controller, and using scope to access it in child controller.
The style guide linked to above is worth a read if you are looking for some guidance on best practice in setting up an angular app (https://github.com/johnpapa/angular-styleguide).

Unable to populate data from json to form in extjs 4

I have created a form panel and would like to populate json data into form.
I am sending url from tastypie.
{"EmailAddress": "aaaaa#gmail.com", "FirstName": "bbbbb", "HomePhone": "23333","resource_uri": "/api/xxxx/1/"}
Name of my form panel is formPanel.
When I am trying to run below the data is not populating by showing error.
formPanel.getForm().load({
method : 'GET',
url : '/api/xxx/1/?format=json',
});
Can any one please help me to load form.
#sreekanth, it is possible to load JSON data directly into a form (if the situation really calls for it). Take a look at the docs for Ext.form.action.Load. I'm not familiar with the tastypie API, but I suspect that the JSON response may not be exactly what ExtJS expects. From the ExtJS documentation:
Response Packet Criteria
A response packet must contain:
success property : Boolean
data property : Object
The data property contains the values of Fields to load. The
individual value object for each Field is passed to the Field's
setValue method.
All that said, #sha's suggestion is a good one: Getting familiar with the Store and Model objects in ExtJS will save you time and trouble in the long run.
I think you need read about ExtJs concepts for Stores and Models. You don't just load JSON object into ExtJs form. You actually need to create a store, load records to this store and load particular record into form.

is it possible to change the query parameters in REST API from script editor in SOAPUI?

i am doing load test on this REST API using SOAPUI.
http://maps.googleapis.com/maps/api/geocode/xml?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false
i ve successfully setup the testsuite and all. my doubt is is it possible to change the query parameters in the REST API url by passing values from the script editor(either javascript or groovy) for the test suite when i perform test?
if so, how should i write the script?
Hope I am clear with my ques.
The parameters are manipulated via the main tab for a REST test request.
The icons look like
a box with a circular arrow - revert params to default values
plain box - clear all params
a plus with some dashes under it - updates this request params from a specified URL
You can dynamically set the values using groovy
If your params look like
address ${address}
sensor ${useSensor}
You can set those values in a groovy script with:
context.setProperty("address", "1600+Amphitheatre+Parkway,+Mountain+View,+CA")
context.setProperty("useSensor", "false")

Categories