在Angular 2组件中选择模板元素并传递给jQuery

我正在尝试解决如何将jQuery与Angular 2结合使用。我一直在尝试下面的例子，其中提到Angular应该控制DOM，并且我应该将元素传递给jQuery

我想我不明白

@ViewChild（）

是如何工作的

我的组件模板中有一个div：

<div id="screenshot">
 // ... content here
</div>

添加此属性：

@ViewChild('screenshot') el:ElementRef;

然后，要进行测试，请尝试在ngAfterViewInit（）中对其调用hide：

这会引发异常：

无法读取未定义的属性“nativeElement”

那么我的视图查询没有找到元素？我检查了文档中的

@ViewChild

，它似乎将一个嵌套组件作为参数。我想我肯定是做错了什么

我希望能够在组件中使用jQuery执行各种工作，因此我需要能够使用选择器，然后调用jQuery方法

---

我是否使用了错误的方法？我应该如何将元素传递给jQuery？

需要进行如下所示的小更改

<div #screenshot>          //replaced id="screenshot" by #screenshot
   // ... content here
</div>

@ViewChild('screenshot') el:ElementRef;

//将id=“screenshot”替换为#screenshot
// ... 满足于此
@ViewChild（“屏幕截图”）el:ElementRef；

谢谢。看起来它现在起作用了。（倒计时结束时我将接受）

是必需的，否则ID不会输出为html。saved my day:）

ngAfterViewInit() {
    $(this.el.nativeElement).hide();
}

<div #screenshot>          //replaced id="screenshot" by #screenshot
   // ... content here
</div>

@ViewChild('screenshot') el:ElementRef;