ng-template 是用来定义模板的，当使用ng-template定义好一个模板之后，可以用ng-container和templateOutlet指令来进行使用。这篇文章给大家介绍了Angular中的ng-templateangular及使用 ngTemplateOutlet 指令的方法，需要的朋友参考下吧
ng-template 是用来定义模板的，当使用ng-template定义好一个模板之后，可以用ng-container和templateOutlet指令来进行使用。
<button>login</button><button>sigup</button>
ng-template在编写高定制性的组件时非常有用。可以把需要定制的内容作为模板传到组件中。
下面看下angular 使用 ngTemplateOutlet 指令
ngTemplateOutlet 的作用
该指令用于基于已有的 TemplateRef 对象，插入对应的内嵌视图。在应用 NgTemplateOutlet 指令时，我们可以通过 [ngTemplateOutletContext] 属性来设置 EmbeddedViewRef 的上下文对象。绑定的上来源gaodai#ma#com搞@@代~&码网下文应该是一个对象，此外可通过 let语法来声明绑定上下文对象属性名。
ngTemplateOutlet 的使用
import { Component } from '@angular/core'; @Component({ selector: 'app-root', template: ` Hello, Semlinker! Hello, Angular! <div></div><div></div> `, }) export class AppComponent { }
ngOutletContext 的使用
import { Component } from '@angular/core'; @Component({ selector: 'app-root', template: ` <p>{{message}}</p> <p>{{msg}}</p> <p>{{msg}}</p><div> </div><div> </div><div> </div> `, }) export class AppComponent { context = { message: 'Hello ngOutletContext!', $implicit: 'Hello, Semlinker!' }; }
总结
以上就是Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法
转载请注明原文链接：Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法
