title: Angular 9 ng-content dynamic update
body: <p>how i can update ng-content by updating selector on content elements?</p>
  <p>I have code in app.component.html:</p>
  <pre><code>&lt;my-slider&gt;
    &lt;img src=&quot;../../assets/logo1.png&quot; /&gt;
    &lt;img src=&quot;../../assets/logo2.png&quot; /&gt;
  &lt;/my-slider&gt;
  </code></pre>
  <p>Here's the code my-slider.component.ts:</p>
  <pre><code>@Component({
    selector: 'my-slider',
    template: '&lt;ng-content select=&quot;.render&quot; &gt;&lt;/ng-content&gt;
               &lt;button (click)=&quot;render()&quot;&gt; Show&lt;/button&gt;',
    styleUrls: ['./slider.component.css']
  })
  export class SliderComponent {
    @ContentChildren(ImgComponent) img: QueryList&lt;ImgComponent&gt;;
    constructor() { }
    render() {
      this.img.last.show();
    }
  }
  </code></pre>
  <p>And ImgComponent.ts</p>
  <pre><code>@Component({
    selector: 'img',
    template: '',
  })
  export class ImgComponent {
    render: boolean = false;
  
    constructor(
      private elRef: ElementRef,
      private renderer: Renderer2
    ) { }
  
    show() {
      this.render = true;
      this.renderer.addClass(this.elRef.nativeElement, 'render');
    }
    hide() {
      this.render = false;
      this.renderer.removeClass(this.elRef.nativeElement, 'render');
    }
  }
  </code></pre>
  <p>When I click the button, a class is added to the element, but ng-content never updates. Can i somehow make it work? Or how I can filter components in ng-content?</p>