title: How to lazy trigger cascade with hidden form element on ngx-formly
body: <p>In <a href="https://github.com/ngx-formly/ngx-formly" rel="nofollow noreferrer">ngx-formly</a>, the <a href="https://formly.dev/examples/other/cascaded-select" rel="nofollow noreferrer">cascading example</a> has these cascading <code>select</code> shown by default. So the hooks to initializing the observers work.</p>
  <p>In my case, I have more complex design. I want to hide those selects and show them based on user opt-in.</p>
  <p>But this way, <code>sportControl</code> form control is null when the form are initialized. These observers on <code>valueChanges</code> cannot be set.</p>
  <pre><code>hooks: {
          onInit: field =&gt; {
            ...
            const sportControl = this.form.get('sport');
            field.templateOptions.options = sportControl.valueChanges.pipe(
             ...
  </code></pre>
  <p>Any suggestions?</p>