Programmatic Styling requires "one tick delay"

2 posts, 0 answers
  1. Robert
    Robert avatar
    8 posts
    Member since:
    Jun 2017

    Posted 24 Jun Link to this post

    I really struggled to get programmatic styling to work on the RadDataForm using Angular. The problem is that in ngOnInit and ngAfterViewInit the properties on the form are not yet fully initialized, so you cannot set those styles. That is, the sequence

    let group = this.formComponent.dataForm.getGroupByName(groupName);
    group.titleStyle.labelTextColor = "Blue";

    fails when called inside either of those methods because titleStyle and/or labelTextColor don't exist.

    Although it's not mentioned anywhere in your documentation, I discovered the "runtime-updates" sample in the demo app and saw that those calls work great if called dynamically, such as in response to a button tap. This made me realize that if I simply do the styling one tick after the page is built then those properties will exist and it should work. Indeed, that was the case.

    So now, inside ngOnInit, after I do my other programmatic setup of the DataForm, I call setTimeout(this.styleForm, 0); Although a bit of a nuisance, it works.

    The most frustrating part of this whole exercise was having to discover these things on my own. The documentation mentions capabilities and gives hints, but it doesn't do a good job of walking you through the steps for a lot of these scenarios.

  2. Deyan
    Deyan avatar
    2147 posts

    Posted 26 Jun Link to this post

    Hello Robert,

    Thanks for writing and taking the time to share your feedback.

    I am sorry to hear about your struggle with styling the RadDataForm component. I have opened an issue with our team and we will immediately proceed with improving the documentation considering the limitations you are pointing out.

    Please accept our apologies and do let us know in case you have further questions or need assistance.

    Progress Telerik
    Did you know that you can open private support tickets which are reviewed and answered within 24h by the same team who built the components? This is available in our UI for NativeScript Pro + Support offering.
Back to Top