Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/svg/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular 调用ngx引导函数的类型脚本_Angular_Typescript_Frontend_Angular5_Ngx Bootstrap - Fatal编程技术网

Angular 调用ngx引导函数的类型脚本

Angular 调用ngx引导函数的类型脚本,angular,typescript,frontend,angular5,ngx-bootstrap,Angular,Typescript,Frontend,Angular5,Ngx Bootstrap,我正在尝试将我的typescript与hide方法链接,在我的中,我正在运行多个函数,当用户单击弹出窗口中的x按钮时,它将全部关闭,typescript中的myfunction()将运行并触发隐藏方法pop2。hide() ngx引导的乐趣 &时代; 试图使typescript调用函数pop2.hide() 使typescript调用函数pop2.hide() 您可以访问类中的模板引用变量 你的HTML <body> <div> <ng-temp

我正在尝试将我的typescript与hide方法链接,在我的中,我正在运行多个函数,当用户单击弹出窗口中的x按钮时,它将全部关闭,typescript中的myfunction()将运行并触发隐藏方法pop2。hide()


ngx引导的乐趣
&时代;

试图使typescript调用函数pop2.hide()








使typescript调用函数pop2.hide()
您可以访问类中的模板引用变量

你的HTML

<body>
  <div>
    <ng-template #popoverContent3>
      <div style="font-size:18px; font-family:'Times New Roman'; font-weight:bold;">
        <p>Fun with ngx-bootstrap
          <button type="button" (click)='myfunction()' class="close" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </p>
      </div>
      <div>
        <p>Trying to make typescript call the function pop2.hide()</p>
      </div>
    </ng-template>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <a [popover]="popoverContent3" #pop2="bs-popover" (click)="isOpen = !isOpen" [outsideClick]="false" placement="right">
 Make typescript call the function pop2.hide()
    </a>
  </div>


</body>

工作

你成功地完成了吗?我现在也有同样的问题。@bananaCute yes可以阅读下面的评论
import { Component, ViewChildren, QueryList, AfterViewInit,ViewChild } from '@angular/core';
import { PopoverDirective } from 'ngx-bootstrap';
@Component({
  selector: 'ngx-app',
  templateUrl: 'app.component.html',
  styles:[`



  ]

  `
})
export class AppComponent implements AfterViewInit{
  @ViewChildren(PopoverDirective) popovers: QueryList<PopoverDirective>;
    @ViewChild('pop2') pop2: ElementRef; //this is change


  ngAfterViewInit() {
    this.popovers.forEach((popover: PopoverDirective) => {
      popover.onShown.subscribe(() => {
        this.popovers
        .filter(p => p !== popover)
        .forEach(p => p.hide());
      });
    });
  }
  myfunction(){
    this.pop2.hide();//working
  }


}