Products

[admin]

Hi Daniz,

The templates define a specific cell rendering. The rowSpan functionality is supported for cells with standard rendering. The feature cannot be applied for template cells.

Regards,
Peter

[admin]

Hi Loick,

You can define the first day of week by using the ‘firstDayOfWeek’ property. For monday, it should be 1.
As for start hour, you can define which hours per day are available and you can interact with them by using a property called ‘available’.
For example, to make the available hours from 5 to 18, you can use available: [{ start: 5, end: 18 }]

Hope this helps.

Regards,
Peter

[admin]

Hi,

Have you checked https://www.htmlelements.com/docs/router/ which shows how to configure the router?

[admin]

Hi ygenin,

The reported issue is confirmed and resolved in the latest version of our software. Thank you for the feedback!

Regards,
Boyko

[admin]

Ok, Thank you for the suggestion.

[admin]

Thank you for the feedback. We will check the provided details. If there is an issue on our side, it will be resolved in a future version of our product.

[admin]

Hi Oliver,

Create a Hidden Column with dataField = your Display Field and your column with the Display Field will work

Regards,
Peter

[admin]

Hi Oliver,

The workaround is valid for any use case. Adding a hidden column is possible in any app using a Grid.

Regards,
Peter

[admin]

We offered a workaround. A fix will come in a future version.

[admin]

As a workaround, you can create a column which is hidden and has its DataField = DisplayName

[admin]

Hi,

The thing is that the add new tab button adds an empty tab. It does not add a new tab with the template structure you added in the template i.e the new tab does not have ng-container in it. For that purpose we can use ng-template. Please, take a look at the updated code below

import { Component, AfterViewInit, ViewChildren, QueryList, ViewChild, ComponentRef, ChangeDetectorRef, ViewContainerRef } from '@angular/core';
import { TabItem, TabItemComponent, TabsComponent } from 'smart-webcomponents-angular/tabs';
import { ThingComponent } from './thing.component';
import { ViewRefAnchorDirective } from './view-ref-anchor.directive';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements AfterViewInit {

  // I am expecting this list to be updated when new tabs are added.
  smartItems: TabItem[] = [];

  @ViewChildren(ViewRefAnchorDirective) anchors = new QueryList();

  @ViewChild('tabs', {read: TabsComponent, static: false}) tabs!: TabsComponent;
  @ViewChild('dynamic', { read: ViewContainerRef })

  viewRef!: ViewContainerRef;

  numTabs = 0;

  ngAfterViewInit(): void {
    this.tabs.getTabs().then(tabs => {
      this.numTabs = tabs.length;
    });

    this.anchors.forEach(tab => this.loadComponent(tab as any));
 	this.smartItems = Array.from(document.querySelectorAll('smart-tab-item'));
	 }

  onAddNewTabClick(event: Event) {
    this.tabs.getTabs().then(tabs => {
      this.numTabs = tabs.length;

      	// create a new dynamic component.
		const container = document.createElement('div');
		const componentRef: ComponentRef<ThingComponent> =  this.viewRef.createComponent(ThingComponent);
	
		// dynamically add the component to a new container host element.
		container.appendChild(componentRef.location.nativeElement);
		// update tabs.
		this.tabs.update(tabs.length-1, 'Updated Tab', container);
		
		
		this.smartItems = Array.from(document.querySelectorAll('smart-tab-item'));
					
    });
  }

  loadComponent(viewRefAnchor: ViewRefAnchorDirective) {
    viewRefAnchor.viewContainerRef.clear();
    return viewRefAnchor.viewContainerRef.createComponent(ThingComponent);
  }
}

Hope this helps.

Regards,
Peter

[admin]

Hi dilbert,

Could you post an example about this?

Regards,
Peter

[admin]

As we currently do not have this updated on our website, you may look at https://stackoverflow.com/questions/70946038/replace-deprecated-angular-componentfactoryresolver-componentfactory.

[admin]

Hi,

By setting the “value” property the QR code will be automatically re-rendered. Example: https://codepen.io/jqwidgets/pen/zYJOdRL

Best regards,
Peter Stoev

Smart UI Team
https://www.htmlelements.com/

[admin]

Hi Peter,

Please, refer to https://codepen.io/jqwidgets/pen/wvEwqeG. The example shows how to have an Input with floating label. It will be in place after the control lost focus.

Best regards,
Peter Stoev

Smart UI Team
https://www.htmlelements.com/

[Author]

Posts