代码之家 › 专栏 › 技术社区 › vijayakumarpsg587

情态语言6

ngx-modal modal-dialog angular

vijayakumarpsg587 · 技术社区 · 8 年前

我想用 ngx智能模式 click . 我目前面临的问题是,一旦加载了组件视图,模型就会在加载时显示。

文件中规定 "autostart" =false 在组件初始化时不加载模式,但这似乎不起作用

这是我的模板视图

 <!-- Trigger/Open The Modal -->

 <button id="myBtn" class="btn btn-primary"  
 (click)="openModal($event)" >Open Modal</button>

  <ngx-smart-modal  #myModal (onOpen)="modalOpened($event)"
       identifier="myModal"  autostart="false">
       <h1>Title</h1>
       <p>Some stuff...</p>
       <button (click)="closeEvent($event)">Close</button>
  </ngx-smart-modal>

我无法在构造函数中获取处理程序或 ngOnit ngAfterViewInit() 到那时,模态就被加载了。

ngAfterViewInit(){
this.smartModalService.get('myModal').close();
  console.log('after view modalstack' 
  ,this.smartModalService.get('myModal').autostart);
}

非常感谢你们的帮助。

2 回复 | 直到 8 年前

Maxime Alejandro Meza 8 年前

您不需要执行所有这些代码来避免autostart,您的问题更多的是模板绑定问题。

你通过了 autostart [...] 因此,您试图传递给组件的值是一个字符串,并被解释为 true .

默认情况下 [autostart] false ,所以你不需要通过它。所有这些都已经在 library README .

[autostart]="false" (注意 []

vijayakumarpsg587 8 年前

@苏加塔·钱达。非常感谢你。我找到了问题所在。因此默认情况下,即使我们指定 自动启动 参数为假

 <ngx-smart-modal  #myModal
   identifier="myModal"  autostart="false">
   <h1>Title</h1>
   <p>Some stuff...</p>

现在,当在视图中指定autostart选项时,默认情况下,无论传入什么值,它都将被视为true。这至少发生在安格拉6。所以删除那里的规范,将ngx智能模式绑定到这样的操作

 <button id="myBtn" class="btn btn-primary"  (click)="openModal($event)" >Open 
     Modal</button>

现在在组件中,您可以打开

openModal(event){
  console.log('opne modal clicked', event.target, '--');
  this.smartModalService.getModal('myModal').toggle();
  // this force the modal to be opened even if clicked outside .User has to 
  press cancel button or close
  this.smartModalService.getModal('myModal').escapable=false;
  this.smartModalService.getModal('myModal').dismissable =false;
  this.smartModalService.getModal('myModal').closable =false;
  this.smartModalService.getModal('myModal').hideDelay = 7;
}

推荐文章

Nick Revenco · 对话框元素内部的元素在对话框边界之外时不会显示

2 年前