typescript Angular2 - TemplateRef 没有提供者（ng2-bootstrap）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/43114306/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular2 - No provider for TemplateRef (ng2-bootstrap)
提问by SrAxi
I have been trying several solutios for this error, but didn't find any succesful way to overcome this: No provider for TemplateRef!
我一直在为这个错误尝试几种解决方案，但没有找到任何成功的方法来克服这个问题：没有 TemplateRef 的提供者！
Error log:
错误日志：
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!
Unhandled Promise rejection: Error in ./FooterComponent class FooterComponent - inline template:15:20 caused by: No provider for TemplateRef! ; Zone: angular ; Task: Promise.then ; Value:
例外：未捕获（承诺）：错误：./FooterComponent 类 FooterComponent 中的错误 - 内联模板：15:20 造成的：没有 TemplateRef 的提供者！错误：./FooterComponent 类 FooterComponent 中的错误 - 内联模板：15:20 导致：没有 TemplateRef 的提供者！
未处理的承诺拒绝：./FooterComponent 类 FooterComponent 中的错误 - 内联模板：15:20 导致：没有 TemplateRef 的提供者！; 区域：角度；任务：Promise.then；价值：
footer.component.ts
页脚.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
页脚.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>
I tried to do the following:
我尝试执行以下操作：
Research: But only found answers / solutions for templates that actually contain some directives like
ngIf,ngSwitch, etc. (Forgetting the*, for example)Add
TemplateReftoproviders. This is what I get:
研究：但只找到答案/为模板，实际上包含像一些指令解决方案
ngIf，ngSwitch等等。（忘记了*，例如）添加
TemplateRef到providers. 这就是我得到的：
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'.
'{选择器：字符串；模板网址：字符串；提供者：typeof TemplateRef[]; }' 不可分配给“组件”类型的参数。财产“提供者”的类型是不兼容的。类型“typeof TemplateRef[]”不可分配给类型“Provider[]”。类型 'typeof TemplateRef' 不能分配给类型 'Provider'。类型“typeof TemplateRef”不可分配给类型“FactoryProvider”。“typeof TemplateRef”类型中缺少属性“provide”。
I will try to see how to add somehow TemplateRefto 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.
我将尝试看看如何以某种方式添加TemplateRef到应用程序的模块中providers。但我不知道这是否是解决方案。我希望有人在我继续研究的同时提出解决方案。
Thank you! :D
谢谢！:D
回答by n00dl3
Research: But only found answers / solutions for templates that actually contain some directives like ngIf, ngSwitch, etc. (Forgetting the *, for example)
研究：但只找到了实际包含一些指令（例如 ngIf、ngSwitch 等）的模板的答案/解决方案（例如忘记 *）
missing *here :
*这里缺少：
<ul class="dropdown-menu pull-right text-left" dropdownMenu>
should be
应该
<ul class="dropdown-menu pull-right text-left" *dropdownMenu>
From 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>
<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>
