We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Mat-select component in editorTemplate not working

Thread ID:

Created:

Updated:

Platform:

Replies:

145879 Jul 11,2019 07:31 PM UTC Jul 30,2020 05:25 AM UTC Angular - EJ 2 5
loading
Tags: Schedule
Hasan Rifaii
Asked On July 11, 2019 07:31 PM UTC

Hello

First, I'm wondering if it's ok to add angular material components to editorTemplate?
for me mat-select is not working



<ng-template #editorTemplate>

<mat-form-field>
<mat-select>
<mat-option *ngFor="let location of locations" [value]="location.id">
{{location.name}}
</mat-option>
</mat-select>
</mat-form-field>
</ng-template>

Hareesh Balasubramanian [Syncfusion]
Replied On July 12, 2019 02:12 PM UTC

Hi Hasan, 
 
Greetings from Syncfusion Support. 
 
We have prepared a sample with the angular material components inside the editor template. And for the same we have prepared sample which can be viewed from the following link, 
 
  <mat-form-field> 
     <textarea matInput id="Subject" class="e-field e-input" type="text" value="{{data.Subject}}" name="Subject" style="width: 100%"></textarea> 
  </mat-form-field> 
  
Please try out the sample. Let us know you need any further assistance. 
 
Regards, 
Hareesh. 


Hasan Rifaii
Replied On July 12, 2019 03:14 PM UTC

Hello 

First, Thank you for support.
I have tried to add mat-select to your sample and still not working. please check it https://stackblitz.com/edit/angular-2icgfu-rihhov

Moreover, there is an issue in dateParser while it's called continuously, please check console -> https://stackblitz.com/edit/angular-2icgfu-rihhov

 


Vinitha Devi Murugan [Syncfusion]
Replied On July 16, 2019 01:28 PM UTC

Hi Hasan, 
 
Thanks for your update. 
 
Q1: We provided the ‘e-field’ support only for limited JS2 Syncfusion components like datepicker, datetimepicker, dropdownlist, multiselect, checkbox and input components . For other JS2 components and angular material component, you have to handle the ‘getting and setting the values to those fields’ in sample end using actionBegin and popupOpen event. 
 
Q2: To overcome this problem, we suggest you to use below highlighted code and same can be available in following link. 
 
@Component({ 
  selector: 'app-root', 
  templateUrl: './app.component.html', 
  styleUrls: ['./app.component.css'], 
  providers: [DayService, WeekService, WorkWeekService,MonthService, AgendaService, MonthAgendaService], 
  encapsulation: ViewEncapsulation.None, 
  changeDetection:ChangeDetectionStrategy.OnPush 
}) 
 
 
Kindly try with the above sample and let us know, if you need any further assistance on this. 

Regards, 
M.Vinitha devi. 
 


sai
Replied On July 29, 2020 05:05 AM UTC

hello,

I am also having the same problem. Did u resolve it?
if you find the solution please share it.

thanks in advance

Vengatesh Maniraj [Syncfusion]
Replied On July 30, 2020 05:25 AM UTC

Hi Sai, 

Greetings from Syncfusion Support. 

We already resolved this problem and provided the solution in our previous updates. Please check our previous updates and share the issue details if you still face the problem. 

For more reference, please check the samples. 


Regards, 
Vengatesh  


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon