Рендеринг компонентов и шаблонов в угловых

Question

Когда мне нужно вставить больше компонентов внутри другого компонента в моем component.html, например:

// This works fine here
<ui-switch [checked]="false"></ui-switch>
<form class="icons-tab-steps wizard-circle" #f="ngForm">
...
// But this does not work here
<ui-switch [checked]="false"></ui-switch>
</form>

Для кода выше, я импортирую:

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { UiSwitchModule } from 'ngx-ui-switch';

А также я используюследующий метод:

ngOnInit() {
    // Of (http://www.jquery-steps.com)
    $.getScript('./assets/js/jquery.steps.min.js');
    // Of 
    $.getScript('./assets/js/wizard-steps.js');
}

wizard-steps.js

// Wizard tabs with icons setup
$(document).ready( function() {
    $(".icons-tab-steps").steps({
        headerTag: "h6",
        bodyTag: "fieldset",
        transitionEffect: "fade",
        titleTemplate: '<span class="step">#index#</span> #title#',
        labels: {
            finish: 'Submit'
        },
        onFinished: function (event, currentIndex) {
            alert("Form submitted.");
        }
    });
 });

Странно то, что без запросов в методе ngOnInit() форма не имеет стиля шагов, нокомпонент ui-switch работает отлично!

Другой пример:

<ng2-smart-table [settings]="settings" [source]="source"></ng2-smart-table>

Когда я использую этот компонент, он работает нормально, но когда я пытаюсь вставить кнопку элемента или выбрать элемент в качестве столбца,компонент не работает и не имеет стилей, поэтому для этого случая я использую renderComponent: CustomRenderComponent свойство ng2-smart-table, и код работает, и я решаю проблему для этого случая.

Я не знаю, как решитьпервая проблема, и я не знаю, было ли решение второй проблемы правильным.

Как правильно отображать компоненты?