加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angular – 组件可以删除它自己的模板并有条件地将其放回去吗?

发布时间:2020-12-17 17:56:53 所属栏目:安全 来源:网络整理
导读:查看* ngIf的源代码: @Input() set ngIf(condition: any) { if (condition !this._hasView) { this._hasView = true; this._viewContainer.createEmbeddedView(this._template); } else if (!condition this._hasView) { this._hasView = false; this._view
查看* ngIf的源代码:

@Input()
  set ngIf(condition: any) {
    if (condition && !this._hasView) {
      this._hasView = true;
      this._viewContainer.createEmbeddedView(this._template);
    } else if (!condition && this._hasView) {
      this._hasView = false;
      this._viewContainer.clear();
    }
  }

我可以使用下面的组件:

@Component({})
class MyComponent{

     constructor ( 
              public _template : TemplateRef,public _viewContainer : ViewContainerRef) {
    }

   onSomeButtonClick(condition){
       if(condition){
          removeMyView();
       }else{
          putTheViewBackIfItsRemoved();
        }
   }
}

尝试在组件内部使用ngIf的逻辑不起作用,我认为这是因为组件的viewContainerRef为空

编辑:

只是提到我不是要隐藏视图,想要从DOM中删除它.

换句话说,我们可以像ngIf的主机元素吗?
我知道你不能在主机上发出指令,这就是为什么我认为可能使用ViewContainer和TemplateRef你可以达到同样的目的.

另一件事是,在使用Angular并创建动态组件之后,我现在唯一的方法是使用ViewContainerRef在DOM中创建一个新组件,但我的重要问题是,Angular本身是否以相同的方式创建组件?

如果是的话,我们不能以某种方式访问??容纳组件的容器吗?

对于那些刚刚开始学习Angular并希望在这里有所帮助的人(感谢你),我应该说我真诚地知道如何在我的模板中使用ngIf:

我现在知道什么是ngIf以及它做了什么:

但是:

<div *ngIf="condition"></div>

不是我的意思,只是因为这可能会删除我的模板中的内容,我必须将所有内容包装在div中以使其工作,这不是我想要的.

我想在内部使用ngIfing清除模板.

更新:

要澄清一下:

换句话说,就像在主机上有一个ngIf:

@Component({

  host:{
    '*ngIf':'shouldBeRemoved'
  }
})
class MyComponent{

我知道你不能把ngIf放在主机上,因为它的指令和主机只编译静态值,这就是为什么我问是否有办法用viewContainerRef或其他东西来处理它.

请知道将ngIf放在模板中会让人感到困惑,这不是我想要的.

再次感谢您的耐心等待.

解决方法

没有正式的方法从组件内部删除模板,对我来说这是有道理的. 如果你删除你的模板,谁会照顾回来. 这适用于ngIf,因为ngIf首先在场景后面创建一个模板,然后将元素嵌入其中,因此它具有对嵌入元素的引用,因此它可以删除它或将其放回.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读