angular4学习-创建结构性指令

import {Directive,ViewContainerRef,TemplateRef,Input} from '@anguar/core'
@Directive({
	selector:'[appUnless]'
})
export class UnlessComponent{
	constructor(private viewcontainer:ViewContainerRef,
	private templateref:TemplateRef<any>){
		
	}
	@Input() set appUnless(condition:boolean){
		if(!condition){
			this.viewcontainer.createEmbeddedView(this.templateref)
		}else if(!condition){
			this.viewcontainer.clear()
			}
	}
}

创建了一个与** *ngIf **相反的结构性指令
ViewContainerRef 可以将一个或多个试图附着到组件中的容器。

createEmBeddevView(template:TemplateRef,context,index)
实例化一个内嵌视图,并把它插入到该容器中

TemplateRef 通过把一个指令放在ng-template或者一个带*前缀的指令上,可以访问TemplateRef实例

猜你喜欢

转载自blog.csdn.net/gexiaopipi/article/details/89131132
今日推荐