Доступ к удаленному контенту

У меня есть компонент, который я использую для отображения блока кода, который заключен в компонент

<gs-code> console.log("Asd")</gs-code>

Компонент выглядит следующим образом

code.component.ts

    @Component({
        selector: 'gs-code',
        providers: [],
        viewProviders: [],
        templateUrl: './code.component.html',
        styleUrls: ['./code.component.less']
    })
    export class GsCodeComponent {
        @Input() lang: string;
        @Input() currentLang: string;
        @ContentChild('content') content;
        copied(event) {
            console.log(event);
        }

        ngAfterContentInit() {
            console.log(this.content, "content");
        }
    }

code.component.html

<pre class="prettyprint">
   <ng-content #content></ng-content>
</pre>
<button class="btn btn-sm" title="Copy to clipboard" (click)="copied(content.innerHtml)"><i class="fa fa-clipboard"></i></button>

Как я могу получить переведенный текст в компонент? Я попытался использовать contentChild и #content как <ng-content #content></ng-content>. Но они не сработали.

Ответ 1