成为名为my-directive的指令。指令的模板包含2个元素：
<div>
<!-- element1 -->
</div>
<div>
<!-- element2 -->
</div>
通过以下方式将其添加到另一个html文件中：
<app-my-directive></app-my-directive>
我的问题是，是否有一种方法可以使该指令仅显示在element1中（如果它被添加到某个html中，而其他所有元素则显示出来）？
在某些情况下隐藏Angular指令的元素
•
问答
liweisb 回答：在某些情况下隐藏Angular指令的元素
您可以发送输入以检测要显示的元素：
@Component({
selector: 'my-directive',inputs: ['myCondition'],template: `
<div *ngIf="myCondition">
<!-- element1 -->
</div>
<div *ngIf="!myCondition">
<!-- element2 -->
</div>
`
})
class MyDirective {
myCondition: boolean;
}
您可以尝试以下方法：
import { Component,OnInit,Input} from '@angular/core';
@Component({
selector: 'my-directive',template: `
<div *ngIf="myCondition">
<!-- element1 -->
</div>
<div *ngIf="!myCondition">
<!-- element2 -->
</div>
`
})
class MyDirective {
@Input() myCondition: boolean;
}