Angular 2 使用 AfterViewInit 从文件执行 JS答案

【问题标题】：Angular 2 Execute JS from file using AfterViewInitAngular 2 使用 AfterViewInit 从文件执行 JS
【发布时间】：2016-06-03 15:48:55
【问题描述】：

对 Angular 2 很陌生，在环顾了几个小时后，我想得到一些帮助。

我有一个带有一些通用函数的 JS 文件。例如：

$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip(); 
});

这个文件实际上包含更多的代码。你可以想象，我想启用所有组件的工具提示。我不能简单地将这个文件包含在index.html 中，因为在加载文件时（还没有）子组件。

经过一番挖掘，afterViewInit() 出现了。 This post 建议将 JS 代码复制/粘贴到 ngAfterViewInit()。这是丑陋的方式（在我看来）......

所以我在这里提出了两个相关的问题：

1# 有没有办法在加载子组件时执行JS代码？例如，类似：

// In app.component.ts
ngAfterChildComponentLoaded(){
   // JS code here
}

这个解决方案非常有趣，因为我不必在所有组件中使用相同的内容实现ngAfterViewInit()。但有可能吗？

2# 有没有办法将JS代码导入复制/粘贴到ngAfterViewInit()？我不想将 300 行 JS 代码复制/粘贴到 15 个不同的组件中（原因很明显）。

非常感谢您的帮助！

【问题讨论】：

标签： javascript angularjs angular

【解决方案1】：

请参阅以下内容，了解如何以 Angular 2/4 获取特定组件的外部 js 文件：

import { Component, OnInit , AfterViewInit} from '@angular/core';
import { Router } from '@angular/router';
declare var $: any;
@Component({
  moduleId: module.id,  
  selector: 'dashboard',
  templateUrl: './dashboard.html',
  styleUrls: ['./dashboard.css']
})
export class DashboardComponent implements OnInit,AfterViewInit {

 constructor() {}

  ngOnInit() {
  }
  ngAfterViewInit(){
    $.getScript('assets/assets/build/js/custom.min.js');
  }

}

【讨论】：

【解决方案2】：

有一个不那么丑的解决方案，如果有人有更好的解决方案，我很乐意接受他的回答！

  ngAfterViewInit(){
      $.getScript('assets/js/myscript.js', function(){});
  }

【讨论】：