1. Home
  2. Forum
  3. Angular - EJ 2
  4. How to bind data using Angular services in Datamanager

How to bind data using Angular services in Datamanager

Hi,

I am trying to bind data to grid with RemoteData. I found the following sample code. In this sample, there is a URL property where I have to set my Web-API url.


I don't want to use this URL property. I have following service to retrieve data from API.

getAllIndexes(): Observable<any[]> {
    return this.http.post<any[]>(`${this.baseUrl}/index/getAllIndexes`, '');
  }

I want to call this service and assign result data to Datamanager rather using your URL property. How to achieve this?

Regards

7 Replies 1 reply marked as answer
MF Mohammed Farook J Syncfusion Team August 20, 2020 08:48 AM UTC

Hi Pranav, 
 
Thanks for contacting Syncfusion support. 
 
 
We have validated the provide code example and the sample. But we are unable to run the given sample.  If you want to bind the data from your external remote service, we have suggested using custom data binding feature in Grid. Please find the demo and documentation for your reference. 
 


Please get back to us if you need further assistance. 
 
 
Regards, 
J Mohammed Farook  


PP Pranav Patel August 20, 2020 11:11 AM UTC

Hi Mohammed,

Please find the sample code:  Sample Code

I have tried your suggested approach. But want to implement this with DataManager and bind data with my angular service rather then URL property. Can you please provide me the sample for it.

Regards,

BS Balaji Sekar Syncfusion Team August 21, 2020 11:36 AM UTC

Hi Pranav, 

We need additional information about your requirement before continuing with your query, so please share the below information regarding your query it will be helpful for us to provide a better solution as soon as possible. 

  1. Please ensure that you have used the remote service data as your own service or not. if not, please share more details about that remote dataService.
  2. Share the code definition of binding the remote service data to Grid component.
  3. Share the Grid full code with service.

Regards, 
Balaji Sekar 


PP Pranav Patel August 24, 2020 09:00 AM UTC

Hi Balaji,

Please find the sample code:  Sample Code

My question is very clear and I already provided the full code in sample code. In this sample code, I have used DataManager for Grid Remote data binding with Url property. I want to bind data by calling service using Datamanager without using url property. I don't have this code. I am expecting this code from you.

I am completely aware of following links.


RS Rajapandiyan Settu Syncfusion Team August 26, 2020 01:39 PM UTC

Hi Pranav, 

Thanks for your support. 

Query :  I am trying to add a dropdown list to the grid column but it says no records found. I want to read the value and show the text. What am I missing here? 

DataManager can be bound to remote data source by assigning service end point URL to the url property. Then only all DataManager operations will address the provided service end point. So, without using url property we cannot get the data from your service in EJ2 DataManager. 

So, we have send a request based on the URL property of the DataManager for getting a data from your server(you must be define the dataAdpators based on your application). Refer the below documentation which illustrates available adaptors in EJ2 DataManager. 


                                             
                                              (or) 

If you using local data in your application, then you can directly use this data in the DataManager(without url). Refer the below documentation. 


                                              (or) 

If you want to get a data from your service without DataManager, we have suggested to use custom data-binding feature in Grid. Please refer the below documentation and sample for more information. 



If you get all the data from externally service only once and bind this data to Grid (don’t send request in next time). We have suggest to use ‘ajax binding’ feature. Please find the documentation for your reference 


Please get back to us if you need further assistance on this. 

Regards, 
Rajapandiyan S           


Marked as answer
RC Rajveer Choudhary November 29, 2021 07:21 AM UTC

Hi,

     I am trying to persistance all setting through enablePersistance property in my angular application its okay and working but it is not persisting column headerText insteand of it persisting field data so I can't see my headerText after refresh the page.

can you help me in this issue.



RS Rajapandiyan Settu Syncfusion Team November 30, 2021 10:37 AM UTC

Hi Rajveer, 

Thanks for contacting Syncfusion support. 

By default, the Grid properties such as column template, header text, header template, column formatter, and value accessor will not persist when enablePersistence is set to true. Because the column template and header text can be customized at the application level. 

If you wish to restore all these column properties, then you can achieve it by cloning the grid’s columns property using JavaScript Object’s assign method and storing this along with the persist data manually. While restoring the settings, this column object must be assigned to the grid’s columns property to restore the column settings. Find the below documentation for more information. 


Please get back to us if you require any further assistance. 

Regards, 
Rajapandiyan S 


Loader.
Up arrow icon