Question

我已经创建了一个显示工具栏及其内容的指令：

import {Component} from "@angular/core";

@Component({
    selector: 'ved-toolbar',
    templateUrl: './ved.toolbar.html'
})
export class VedToolbar {

time: Date;

constructor() {
    setInterval(() => {
        this.time = new Date();
    }, 1000);
}
}

模板：

<md-toolbar flex="50" color="primary">
<md-toolbar-row>
    <bootstrap-grid>

        <row style="margin: 0;">
            <column md="1"></column>
            <column md="11">
                <column md="4">
                    <span>LOGO Creditas</span>
                </column>
                <span>Prihlaseny pouzivatel</span>
                <column md="4">
                    <span>{{ time | date: 'HH:mm:ss' }}</span>
                </column>
                <column md="4">
                    <span><a routerLink="/doc/detail" routerLinkActive="active">Nápoveda</a></span>
                </column>
            </column>
        </row>
    </bootstrap-grid>

</md-toolbar-row>

然而，当我在<ved-toolbar></ved-toolbar>中使用<head></head>时，它只呈现一个空标记，因此不会显示任何内容。

如果我将它放在md-sidenav-container内，它会渲染，但样式应用错误，所以它没有固定在顶部。

但是，当我将ved-toolbar的内容放入<head/>时，它呈现得很好。

当然，我已将VedToolbar添加到应用的模块declarations列表中。

请问这里出了什么问题？

md-toolbar不会呈现为组件

0 个答案: