Javascript angular/typescript中的触发器引导js collpase（）函数

我正在使用bootstrap 3和Angular 2来折叠/隐藏内容。我需要能够在双击按钮时折叠。我为此创建了一个函数，但似乎无法访问typescript中的.collapse（）函数

如何访问切换功能，以便在双击功能中使用它？

您的切换功能应如下所示：

toggleMe($event){
   $($event.target).collpase('toggle');
}

---

这是因为您需要jQuery对象来访问折叠函数，但在event.target中，您使用的是纯DOM对象。

嘿，使用$close总是使用angular来处理引导模式

  <div class="modal-footer hidden-print">
        <button type="submit" class="btn btn-success" ng-click="vm.saveTeam($close())"> Save </button>
        <button type="button" class="btn btn-default" ng-click="$close()">Cancel</button>

    </div>
</form>

拯救
取消

因此，我无法找到一个完美的解决方案，而不是使用jquery，我不想在我的应用程序中使用jquery。我能够使用Angular Animate而不是Bootstrap Collpase实现更好的功能，请参见下面的一些代码：

 <button (dblclick)="toggleMe()" type="button">Simple collapsible</button>

  <div [@visibilityChanged]="visiblityState" >
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</div>

---

在没有jquery的情况下使用它的任何方法，纯角度/类型脚本可能都不会，但是没有理由在这里避免使用jquery。引导需要jQuery才能工作，所以您的网站上可能已经有了jQuery。

  <div class="modal-footer hidden-print">
        <button type="submit" class="btn btn-success" ng-click="vm.saveTeam($close())"> Save </button>
        <button type="button" class="btn btn-default" ng-click="$close()">Cancel</button>

    </div>
</form>

 <button (dblclick)="toggleMe()" type="button">Simple collapsible</button>

  <div [@visibilityChanged]="visiblityState" >
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</div>

import { trigger, state, style, animate, transition } from '@angular/animations';


@Component({
   selector: 'my-component',
   templateUrl: './tree-search-node.component.html',
      animations: [
       trigger('visibilityChanged', [
       state('shown', style({
                      height: '0px',
                      opacity: '0',
                      overflow: 'hidden',
                     // display: 'none'
        })),
       state('hidden', style({
                       height: '*',
                       opacity: '1',
                      // display: 'block'
    })),
  transition('shown => hidden',animate('200ms ease-in')),
  transition('hidden => shown', animate('200ms ease-out')),
      ])
    ]
 })


 visiblityState = 'shown';

   toggleMe() {
      if (this.visiblityState === 'hidden')
           this.visiblityState = 'shown'
      else
            this.visiblityState = 'hidden'
         }