如何在 Angular 7 中使用 JavaScript 代码?

2024-01-30

我正在尝试在移动屏幕上使用MaterializeCSS 的帮助下制作一个可折叠的导航栏,并且需要在其中使用JavaScript 代码。 我应该在哪里编写这段 JavaScript 代码?

这是我想使用的代码:

**$(document).ready(function(){
    $('.sidenav').sidenav();
  });**

步骤1:在assets文件夹中创建一个js文件夹。

步骤 2:在 js 文件夹中创建一个新的 .js 文件。资产 -> js -> example.js

步骤 3:在脚本数组内的 angular.json 中添加 example.js 的路径。

步骤 4:在需要该函数的 component.ts 文件内声明 example.js 中创建的 js 函数。

步骤 5:调用 ngOnInIt() 中声明的函数。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 Angular 7 中使用 JavaScript 代码? 的相关文章

  • 使用 getElementById 在 javascript 中使用正则表达式进行 Html 表单验证?

    我想使用正则表达式验证 html 表单的示例模式 AAA 111 2222 aa 1234 目前 我的代码要么为所有输入返回 正确 要么为所有输入返回 不正确 并且我无法弄清楚我的问题出在哪里 var x document getEleme
  • React.js this.props.data.map() 不是一个函数

    我正在搞乱反应并尝试解析和渲染 json 对象 现在 我只是使用硬编码对象设置它以进行测试 而不是从 ajax 调用中获取它
  • 将箭头添加到 Twitter Bootstrap 的下拉药丸中?

    我的 Twitter 引导下拉按钮成功工作 但我有一个小问题 这里的黑色导航栏 http twitter github com bootstrap javascript html dropdowns http twitter github
  • 将 Angular v12 升级到 v13 时出现“模块未找到”错误

    嗨 开发者和贡献者 我正在努力找出以下错误的问题所在 src app models type ModelType ts 2 0 44 错误 找不到模块 错误 导出字段无法解析目录 请求为 当我将 Angular 版本从 v12 升级到 v1
  • 如何防止在达到一定字符数后向文本区域输入内容?

    使用下面的代码 任何超过指定最大值的输入都将被删除 但这会产生一种效果 即键入字符后立即将其删除 我宁愿简单地阻止输入字符
  • 函数声明或函数表达式

    我刚刚在块作用域中定义函数时遇到了问题 考虑以下程序 try greet function greet alert Merry Christmas catch error alert error 我希望这个程序能够发出警报Merry Chr
  • 检测 JavaScript 中的焦点丢失

    我希望能够检测 JavaScript 中任意元素何时失去焦点 因此我可以构建一个类似于 jEdit 的内联编辑工具 我不能依赖 jQuery 来实现这个库 所以我需要一个本机方法来完成它 我查看了 onblur 这似乎是正确的事情 但 MD
  • 如何混淆或使 JavaScript 文件不可读?

    我的应用程序中有 JavaScript 脚本 其中包含 JavaScript 和 jQuery 函数 所有用户与我的应用程序的交互都是动态的 并且通过 jQuery 传递到应用程序 我意识到 当我在客户端运行我的应用程序时 客户端可以通过查
  • Jest - 语法错误:无法在模块外部使用 import 语句

    我在用jest 24 9 0无需任何配置 从 create react app 全局安装 在这些文件中我使用 es6 模块 使用时没有报错 test react scripts test 但是当我开始使用时jest with test je
  • Flot 0.8.2 折线图 - 颜色错误

    我正在使用 Flot 折线图并设置它们的颜色 我发现了一个奇怪的错误 在前 3 种颜色之后 绘图对所有其他线条使用最后一种颜色 这不是正确的行为 更有趣的是图例显示了正确的颜色 这是一个已知的错误 var dataSet label d1
  • 当元素具有多个类时如何在 switch 语句中检查 className

    在下面的示例中 我只想单击该选项以在警报中显示 我正在尝试使用 switch 语句来确定单击了哪个类 如果我的 div 不包含多个类 则我的示例将有效 我尝试使用classList contains在我的 switch 语句中无济于事 有没
  • Javascript/DOM:如何删除 DOM 对象的所有事件侦听器?

    只是问题 有没有办法完全删除对象的所有事件 例如一个div 编辑 我添加每div addEventListener click eventReturner false 一个事件 function eventReturner return f
  • jVectorMap - 向下钻取地图 - 自定义背景

    我正在使用 jVectorMap 中的向下钻取地图 并且尝试将自定义背景颜色设置为地图的第二层 为了自定义主级别 我使用 main 参数 但我不知道如何将其扩展到地图的较低级别 提前致谢 马切伊 None
  • jQuery 显示/隐藏兄弟姐妹

    我有这段代码 旨在首先隐藏除第一个元素之外的所有相关元素 这个 做的不错啊接下来 它应该根据选择的项目显示 隐藏这些元素 但这部分不起作用 想法 jQuery accordion dl not first child hide hide a
  • 如何在放置后拖动图像克隆?

    我的图像在旋转后可以拖动 但是当图像掉落时我无法第一次拖动图像 这是图像拖放的代码 dhtmlgoodies xpPane li rotatable 我可以拖动此图像克隆并将其放在 工作区域 上 我无法在放置后第一次拖动图像克隆 但克隆在旋
  • 如何在 Bootstrap 4 轮播中堆叠多个图像

    我不知道如何使用 Bootstrap 4 以及如何在一张幻灯片中显示多个小图像 例如缩略图 而不是让图像填充轮播的宽度 我已经使用下面的代码尝试了一些操作 但仍然无法堆叠很多图像 div class container h2 class t
  • Javascript 替换为正则表达式无法正常工作

    我正在尝试使用正则表达式验证名称 正则表达式阻止用户连续输入 2 个空格或点 这是我的代码 function test input var regex A Za z 0 1 s 0 1 input value input value rep
  • 如何制作饼图聚合数据源?

    Using 适用于 ASP NET MVC 的 Kendo UI 完整版 http www kendoui com 版本 2013 3 1119 2013年11月20日 如果我有这段代码 status chart kendoChart da
  • 如何使用 jQuery 和“this”捕获更改的表单元素值

    我有以下代码 每当我的 Web 表单中发生元素更改时 该代码都会起作用 我一直在纠结的是如何捕捉表单字段元素 id name and 改变值当更改事件被触发时 谁能帮我解决这个问题吗 Thanks JavaScript
  • ES6解构对象赋值函数参数默认值

    您好 我正在查看在传递函数参数时使用对象解构的示例对象解构演示 https developer mozilla org en US docs Web JavaScript Reference Operators Destructuring

随机推荐

  • Javascript 映射二维数组

    我有这个数组 rows 89 18 9 1903 3 4 3 1 800 它应该看起来像这样 89 1903 3 18 3 1 9 4 800 正在运行的代码如下所示 rows 0 map columnIndex gt rows map r
  • Spring Elastic Search 自定义字段名称

    我是 Elastic Search 的新手 我正在尝试使用 Spring data elasticsearch 来实现它 我的弹性搜索文档中有一些名称为 Transportation Telephone Number 的字段 当我尝试将我的
  • 用于通配符 url 映射的 Kubernetes Ingress 控制器

    我需要我的每个用户都可以通过自定义网址访问服务 例如 abccompany mycloudapp com 每个服务都是 kubernetes 服务 我正在查看入口控制器 但我需要一种使用通配符主机字段并以某种方式将值读入 path 和 se
  • #someDiv 是什么意思? [关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 当用户将鼠
  • Google Datastore 模拟器从本地数据库中删除数据

    我的本地计算机 Mac OSX 10 11 6 上运行着一个本地数据存储模拟器实例 我已经有一堆数据了 但我想从本地数据库中删除所有数据 从头开始 不过 我已经尝试删除存储数据的目录 我认为的目录 启动模拟器时会出现此消息 WARNING
  • VS2015中sprintf()和wsprintf()的格式差异

    我正在将一些代码从多字节移动到 unicode 并发现我的字符串格式出现错误 看起来 Visual Studio 2015 在 sprintf 和 wsprintf 之间处理宽度参数说明符 的方式不同 这是编译器错误或副作用 还是我错过了一
  • Angular 9 PWA 哈希不匹配(cacheBustedFetchFromNetwork)

    我有一个 Angular PWA 它无法离线启动 http 错误 504 当我检查 ngsw state 时 出现此错误 Error Hash mismatch cacheBustedFetchFromNetwork https examp
  • codeigniter 分页 - 每个页面上的结果保持相同

    我正在使用 Codeigniter 分页 但遇到了问题 url 在点击时发生变化 如限制更新 例如displayAllUsers 10 到 displayAllUsers 15 但结果保持不变 这是我的控制器 public function
  • C# XAMARIN.FORMS 中的超链接按钮

    我想创建具有点击可能性的标签 就像在 WIN 手机 xaml 中一样
  • 获取 openX 的域详细信息以及 Portrait_id 和 Landscape_id

    我刚刚下载了 OpenX android sdk 并尝试将其指向本地创建的域 但看起来它对我来说效果不佳 布局中的 OXMAdBanner 看起来像
  • 如何从事件处理程序获取 jquery 选择器

    我在页面上有几个输入元素 其中一个 第一个 是我可以输入任何其他元素的特定 ID 的地方 我希望我的代码以这样的方式设置 当我关注任何其他元素并且其 id 与第一个元素中输入的文本匹配时 它会突出显示 并在其中显示指示我选择了正确元素的文本
  • “更改表重命名”和“重命名表”有什么区别?

    我正在使用MySQL 举个例子 我想将表A重命名为B 那么下面的语句有什么区别 alter table A rename to B 和这个 rename table A to B 谁能详细比较一下它们之间的情况吗 是否会根据不同的发动机而有
  • 封装 Action 和 Func

    我正在尝试为某种 IExecutable 接口进行设计 我不会详细介绍 但重点是我有几个需要从基类执行的操作 它们可能采用不同的参数 没什么大不了的 并且它们可能 可能不返回值 到目前为止 这是我的设计 public abstract cl
  • 在 AngularJS 服务调用后填充 jQuery UI 手风琴

    我目前正在尝试构建一个 AngularJS 应用程序 其中使用 jQuery UI 手风琴控件 问题是 jQuery UI 手风琴已启动before我的 AngularJS 服务已完成从服务器加载数据 换句话说 手风琴在启动时没有任何数据
  • 如何在 WPF KeyBinding 中传递来自 DataGrid 的单元格信息?

    我有一个 DataGrid 来列出 MobileInfo 集合 DataGrid 配置为SelectionUnit FullRow 如果我单击任何行 那么它会选择整行 此外它还指向鼠标被击中的带有边框的单元格 边框选择在键盘导航时移动例如
  • 我如何知道库是服务器端、客户端还是两者?

    dart html 是一个客户端库 而 dart io 是一个服务器端库 因为这是显而易见的 但是一个时髦的库怎么样 http pub dartlang org packages http pub dartlang org packages
  • 为什么带有 T: 类约束的泛型方法会导致装箱? [复制]

    这个问题在这里已经有答案了 为什么将 T 限制为类的通用方法会在生成 MSIL 代码中包含装箱指令 我对此感到非常惊讶 因为肯定由于 T 被限制为引用类型 所以生成的代码不需要执行任何装箱 这是 C 代码 protected void Se
  • 仅在某些条件下使用什么 RxJava 运算符来链接可观察量

    我正在 RxJava Android 中开发一个完整的应用程序 试图使事情尽可能成为 Rx 方式 我认为我已经实现了我想要的目标 但现在我遇到了一个问题 我确信存在更好的方法来做到这一点 它包括 从 Observable 获取布尔值 A 如
  • TypeScript 升级后 Promise 返回类型错误

    Using typescriptv2 3 4 以下代码运行良好 getStuff Promise
  • 如何在 Angular 7 中使用 JavaScript 代码?

    我正在尝试在移动屏幕上使用MaterializeCSS 的帮助下制作一个可折叠的导航栏 并且需要在其中使用JavaScript 代码 我应该在哪里编写这段 JavaScript 代码 这是我想使用的代码 document ready fun