我是 Angular 的新手,并试图在打字稿页面中列出引导面板。
所以我试图这样做
bootstrap.panel.component.ts
import {Component} from 'angular2/core';
@Component({
selector: 'bs-panel',
template: `
<div class="panel panel-default">
<div class="panel-heading">
<ng-content select=".heading"></ng-content>
</div>
<div class="panel-body">
<ng-content select=".body"></ng-content>
</div>
</div>
`
})
export class BootstrapPanel{
}
然后在主应用程序组件文件中,我像这样引用并使用它
app.component.ts
import {Component} from 'angular2/core';
// bootstrap panel
import {BootstrapPanel} from './bootstrap.panel.component';
@Component({
selector: 'my-app',
directives: [BootstrapPanel],
template: `
<!-- ngContent sample -->
<br/> <br/> <br/>
<bs-panel>
<div class="heading"> This is heading </div>
<div class="body"> This is the body! </div>
</bs-panel>
`
})
export class AppComponent {
}
但这没有在内容中显示文本
这是它的输出
一旦我按下F12,在控制台部分我可以看到这样
上面的错误是
未捕获的类型错误:无法读取 null 的属性“getSelection”
然后我找到了以下解决方案,它禁用了 Google Chrome 中的所有扩展,然后上面的控制台错误消失了,但内容中仍然没有出现。
我该如何纠正这个