角度:$未定义

时间:2019-10-27 12:07:01

标签: javascript angular typescript

我在Angular中使用jQuery和jquery-ui遇到麻烦。

我创建了一个函数,但是执行时出现错误:

  

$未定义。

我在这里留下了stackblitz链接,以查看我是否与进口商品进行了交谈或是否需要其他东西。

Stackblitz

2 个答案:

答案 0 :(得分:2)

您不需要jquery即可完成任何您想做的事情。 Angular开箱即用。

您可以使用Angular's Event Binding将点击事件绑定到html元素:

<a href="javascript:void(0)" (click)="#proImage.click()">Upload Image</a>
<input type="file" #proImage name="pro-image" style="display: none;" (change)="fileChanged(#proImage.files)" class="form-control" multiple>

然后在组件中实现fileChanged(files: FileList)

此外,请不要在Angular之外操作DOM。不要使用JQuery在DOM中添加或删除元素。您最有可能要使用Angular的attribute bindingngFor or ngIf directives。如果这些都不适合,则可以使用Angular的Renderer2

在99.99%的情况下,您不想使用JQuery。请阅读Angular文档,其中包含有关大多数内容的详细示例和教程。

答案 1 :(得分:0)

如果将jQuery与Angular一起使用,通常会误用Angular,或者没有充分利用Angular。奥马尔(Omar)的先前答案对此进行了详尽的解释。

但是,如果这是一些旧代码,而您又需要它,则应该将jquery添加到angular.json文件的“脚本”中。

"scripts": ["node_modules/jquery/dist/jquery.min.js"]

接下来,您要以不同的方式从hello.component导入它。

import $ from "jquery";

无需声明:

declare var $: any;

Final code.