Angular2-没有提供TemplateRef的提供者(ng2-bootstrap) [英] Angular2 - No provider for TemplateRef (ng2-bootstrap)
问题描述
我一直在尝试几种解决方案来解决此错误，但是没有找到成功解决该问题的方法:没有TemplateRef的提供者！
I have been trying several solutios for this error, but didn't find any succesful way to overcome this: No provider for TemplateRef!
错误日志:
例外:未捕获(承诺):错误:./FooterComponent中的错误 类FooterComponent-内联模板:15:20造成原因:没有提供者 用于TemplateRef！错误:./FooterComponent类中的错误 FooterComponent-内联模板:15:20造成原因:没有提供者 TemplateRef！
EXCEPTION: Uncaught (in promise): Error: Error in ./FooterComponent class FooterComponent - inline template:15:20 caused by: No provider for TemplateRef! Error: Error in ./FooterComponent class FooterComponent - inline template:15:20 caused by: No provider for TemplateRef!
未处理的承诺拒绝:./FooterComponent类中的错误 FooterComponent-内联模板:15:20造成原因:没有提供者 TemplateRef！ ;区域:角度；任务:Promise.then;值:
Unhandled Promise rejection: Error in ./FooterComponent class FooterComponent - inline template:15:20 caused by: No provider for TemplateRef! ; Zone: angular ; Task: Promise.then ; Value:
footer.component.ts
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'sa-footer',
templateUrl: './footer.component.html'
})
export class FooterComponent implements OnInit {
constructor() {}
ngOnInit() {}
}
footer.component.html
<div class="page-footer">
<div class="row">
<div class="col-xs-12 col-sm-6">
<span class="txt-color-white">myAPP © 2016</span>
</div>
<div class="col-xs-6 col-sm-6 text-right hidden-xs">
<div class="txt-color-white inline-block">
<i class="txt-color-blueLight hidden-mobile">Last account activity <i class="fa fa-clock-o"></i>
<strong>52 mins ago </strong> </i>
<div class="btn-group dropup" dropdown>
<button class="btn btn-xs dropdown-toggle bg-color-blue txt-color-white" dropdownToggle>
<i class="fa fa-link"></i> <span class="caret"></span>
</button>
<ul class="dropdown-menu pull-right text-left" dropdownMenu>
<li>
<div class="padding-5">
<p class="txt-color-darken font-sm no-margin">Download Progress</p>
<div class="progress progress-micro no-margin">
<div class="progress-bar progress-bar-success" style="width: 50%;"></div>
</div>
</div>
</li>
<li class="divider"></li>
<li>
<div class="padding-5">
<p class="txt-color-darken font-sm no-margin">Server Load</p>
<div class="progress progress-micro no-margin">
<div class="progress-bar progress-bar-success" style="width: 20%;"></div>
</div>
</div>
</li>
<li class="divider"></li>
<li>
<div class="padding-5">
<p class="txt-color-darken font-sm no-margin">Memory Load <span class="text-danger">*critical*</span>
</p>
<div class="progress progress-micro no-margin">
<div class="progress-bar progress-bar-danger" style="width: 70%;"></div>
</div>
</div>
</li>
<li class="divider"></li>
<li>
<div class="padding-5">
<button class="btn btn-block btn-default">refresh</button>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
我尝试执行以下操作:
-
研究: 但是只找到了实际上包含某些指令(例如
ngIf，ngSwitch等)的模板的答案/解决方案(例如，忘记了*)
Research: But only found answers / solutions for templates that actually contain some directives like
ngIf,ngSwitch, etc. (Forgetting the*, for example)
将TemplateRef添加到providers.这就是我得到的:
Add TemplateRef to providers. This is what I get:
'{选择器类型:字符串； templateUrl:字符串;提供者: typeof TemplateRef []; }'不能分配给类型的参数 '成分'.属性提供者"的类型不兼容. 类型"typeof TemplateRef []"不可分配给类型"Provider []". 类型"typeof TemplateRef"不可分配给类型提供者". 类型'typeof TemplateRef'不能分配给类型'FactoryProvider'. "typeof TemplateRef"类型缺少属性"provide".
Argument of type '{ selector: string; templateUrl: string; providers: typeof TemplateRef[]; }' is not assignable to parameter of type 'Component'. Types of property 'providers' are incompatible. Type 'typeof TemplateRef[]' is not assignable to type 'Provider[]'. Type 'typeof TemplateRef' is not assignable to type 'Provider'. Type 'typeof TemplateRef' is not assignable to type 'FactoryProvider'. Property 'provide' is missing in type 'typeof TemplateRef'.
我将尝试查看如何以某种方式将TemplateRef添加到应用程序的模块providers.但是我不知道这是否是解决方案.
我希望在我继续研究的过程中能提出解决方案.
I will try to see how to add somehow TemplateRef to the app's module providers. But I don't know if this is the solution.
I hope someone comes out with a solution while I continue researching.
谢谢！ :D
推荐答案
研究:但仅找到模板的答案/解决方案，而这些模板实际上包含一些指令，例如ngIf，ngSwitch等.(例如，忘记*)
Research: But only found answers / solutions for templates that actually contain some directives like ngIf, ngSwitch, etc. (Forgetting the *, for example)
在这里缺少*:
<ul class="dropdown-menu pull-right text-left" dropdownMenu>
应该是
<ul class="dropdown-menu pull-right text-left" *dropdownMenu>
来自 ng2-bootstrap :
<div class="btn-group" dropdown>
<button dropdownToggle type="button" class="btn btn-primary dropdown-toggle">
Button dropdown <span class="caret"></span>
</button>
<ul *dropdownMenu class="dropdown-menu" role="menu">
<li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>
<li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>
<li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>
<li class="divider dropdown-divider"></li>
<li role="menuitem"><a class="dropdown-item" href="#">Separated link</a>
</li>
</ul>
</div>
这篇关于Angular2-没有提供TemplateRef的提供者(ng2-bootstrap)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
