开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Angular material Dragable对话框不工作

Angular Material是一个UI组件库，提供了一系列的可重用组件，用于构建现代化的Web应用程序。其中包括Dragable对话框，可以实现拖拽对话框的功能。

Dragable对话框不工作可能有以下几个原因：

版本不兼容：首先要确保使用的Angular Material版本与Angular版本兼容。可以查看官方文档或者GitHub仓库中的版本兼容性说明。
引入错误：确保正确引入了Angular Material的相关模块和组件。在使用Dragable对话框之前，需要在模块中导入MatDialogModule和DragDropModule。
代码错误：检查代码中是否有错误或者遗漏的部分。可以参考官方文档中提供的示例代码，确保按照正确的方式使用Dragable对话框。
CSS样式问题：有时候Dragable对话框不工作可能是由于CSS样式冲突或者覆盖导致的。可以检查自定义的CSS样式是否与Dragable对话框的样式冲突。

如果以上方法都无法解决问题，可以尝试在Angular社区或者相关论坛上寻求帮助，或者查阅更多的文档和教程来解决该问题。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云容器服务（TKE）。腾讯云云服务器提供了弹性、安全、稳定的云服务器实例，可以满足各种规模的应用需求。腾讯云容器服务是一种高度可扩展的容器管理服务，可以帮助用户轻松部署、管理和扩展容器化应用。

腾讯云云服务器产品介绍链接：https://cloud.tencent.com/product/cvm 腾讯云容器服务产品介绍链接：https://cloud.tencent.com/product/tke

相关搜索:angular form，不工作重置方法不工作 Angular HttpInterceptor不工作 Angular JS Material对话框局部注射错误 Angular material 2 SnackBar不工作 Angular Material css在Slider上不工作 Angular Material FlexLayout fxHide不隐藏 Angular Material Form控件示例不运行 Angular Material Sticky Header停止工作 Angular Material对话框-将数据发送到对话框 angular material对话框中的透明背景

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

Flutter-Dart全局可拖动悬浮球

Dart全局悬浮球 import 'dart:math'; import 'package:flutter/material.dart'; import 'package:provider/provider.dart...class _PubScaffoldState extends State { List _bottomSheetList = ['x','y','z']; bool dragAble...= true; return SingleChildScrollView( child: Container( // 返回一个有高度的组件，对话框高度就是此高度...) { setState(() { lastStartOffset = details.globalPosition; dragAble...onPressed; BallContainer({this.onPressed}); @override Widget build(BuildContext context) { return Material

5561 1

Angular 6的新特性介绍

遵循数据表组件的模式，CDK包含核心树指令，而Angular Material则提供与顶层的Material Design样式相同的体验 Material 运行命令，添加Material ng add...@angular/material ?...如果要了解更多有关Material的信息，请点击这里 CLI工作空间 CLI6.0版本现在支持包含多个项目的工作空间，如多个应用程序或库。...ng generate library 这个命令将在你的CKI工作空间创建一个库项目，并且自动添加配置信息到angular.json文件和tsconfig.json中。...点击查看更多关于CLI工作空间的信息 Providers的改变为了使我们的程序变得轻量，Angular6将模块引入服务的模式，改成服务引入模块的模式。

2.3K2 1

Angular Material 的设计之美

我可以说一下自己的感受，Angular Material 的交互更加流畅，细节做的更好。 Angular Material 组件库虽然很优秀，但是却被戴上了只适合做 C 端界面的帽子。...接下来我会从相对宏观的角度介绍 Angular Material 设计的一些亮点，并且简单介绍 Angular Material 的一些使用技巧。...顺便插一句，如果大家纠结用 Sass 还是 Less，可以看一下这篇文章 CSS 预处理器中的循环，个人不建议用 Less，请原谅我无意引战?。...我最开始认为将所有样式全部写到 mixin 中并不是很优雅的做法，但是在编写 ng-matero 暗黑主题的时候，我发现不这样做是不行的。以下是 Angular Material 主题定制的方法。...总结文章篇幅有限，以我浅薄的资历还无法将 Angular Material 的设计之美剖析的面面俱到，但是如果大家通过这篇文章能够更好的了解 Angular Material 或者对 Angular

5K3 0

Angular 6正式版发布，都有哪些新功能

ng add @angular/material：安装并设置 Angular Material 和主题，注册新的初始组件到ng generate中。...例如： ng generate @angular/material:material-table 想要了解更多的资料：Angular Material Schematics CLI Workspaces...CLI v6 现已支持多项目工作区，如多个应用程序或库，CLI 项目用 angular.json 取代 angular-cli.json 构建和配置项目。...每个 CLI 工作区都有项目，每个项目都有目标，每个目标都可以有配置。...例如，执行下面的代码： ng generate library 该命令将在 CLI 工作区内创建一个库，并对其进行配置以进行测试和构建。

4.2K2 0

Ng-Matero V10 正式发布！

Angular v10 在六月下旬就悄无声息的发布了，虽然 v9 的发布延期了两个月，但是 v10 并没有受影响，仍然如期而至。...再来说一下 Angular Material， v10 有一个非常大的变化，就是增加了 datepicker 的区间选择功能，不用多说，这是一个极其实用的功能。...其实 v10 版本除了将 Angular 和 Angular Material 升级之外，主要是调整了 schematics ng add 的兼容问题，其它代码和 v9 最新版是一样的。...前期的工作主要是完善 v9 的版本。本文主要说一下 Ng-Matero 以及 Material Extensions 几个关键的优化点。...在线示例：https://ng-matero.github.io/ng-matero/#/forms/dynamic 主题化主题化的内容可以说很多，暂时不展开讲，简单说一下 Material Extensions

1.4K1 0

Angular 11正式发布：加入webpack 5，升级至TS 4.0，不再支持IE 9 和10

社区的支持工作做计划。...它们提供了健壮易读的 API 表面，可以帮助大家更好地测试 Angular Material 组件。...它为开发人员提供了一种在测试过程中使用受支持的 API 与 Angular Material 组件交互的方法。随着版本 11 的发布，我们为所有组件都加上了测试带！...有关这些 API 和其他新特性的更多细节和示例，请务必查看 Angular Material Test Harnesses 的文档： http://material.angular.io/cdk/test-harnesses...将来，webpack v5 会带来：持久磁盘缓存，以加快构建速度 cjs 摇树，减小包体积这一支持是实验性的，并且正在开发中，因此我们不建议你将其用于生产用途。想试用 webpack5 吗？

3.3K3 0

Ng-Matero v15 正式发布

具体效果如下图所示：在线体验地址焦点管理属于 a11y 的范畴，使用 Angular Material 可以很轻松的完成 a11y 的需求，同时 Angular CDK 中也有 A11yModule...另外，侧边栏菜单按钮使用语义化标签进行了优化，关于按钮的选择可以参考 Angular Material 在 Button 文档中的说明： Angular Material 使用原生的 ...基于 MDC 的 Angular Material 组件我觉得 v15 最大的变化不是 Angular，而是 Angular Material。...说一下自己的感受：在第一次得知 Angular 官方将在 v15 全面迁移 MDC 时，内心还是很抵触的，主要是觉得 MDC 的很多效果做的不如 Angular Material 细腻（比如 form-field...再就是 card 组件，必须配合 mat-card-content 才会出现边距，如果用到的 card 组件很多，这块的工作量也挺大的。

5.4K4 0

看看Angular有啥新玩法！手把手教你在Angular15中集成Excel报表插件

Angular15新特性 Angular框架（以下简称“Angular”）作为一款由谷歌开发的Web应用程序框架，其强大的依赖注入系统、可重复使用的模块化开发理念和响应式编程模式等特点让Angular一问世便取得了巨大的关注和流量...基于MDC的组件发布到稳定版 Angular15优化了基于Material Design Components for Web（MDC）中Angular material对于组件的重构，这样使得 Angular...更加接近Material Design的规范。...Angular15中引入报表插件大家都知道Excel作为一款统计、分析数据信息的办公软件，在大家日常工作和生活中起到了非常重要的作用。...Angular集成报表插件: 新建一个文件夹用来存放工作区代码（文件夹路径最好是英文）。使用指令初始化Angular工程（用命令提示符CMD输入指令）。

2861 0

Ng-Matero 0.1 发布了！

距离 Ng-Matero 发布第一版已经过去了一个多月，然后很颓废地休息了半个月，最近项目的关注度好像明显提升了，所以如果项目不维护感觉对不起大家。作为一个工程项目最好的方式还是通过脚手架安装。...切记在新建 angular 项目的时候一定要选择 scss，因为没有做兼容处理，选择其它格式会有点问题，可以在 angular.json 中修改主样式入口。...其它参数大家可以自己尝试一下，这里借鉴了 material 的参数项。版本号因为还有很多需要完善的地方，所以短期内不会发布正式版。...因为 ng-matero 是基于 material 组件库，所以可以第一时间更新 ng 的最新功能?。...另外主题系统还不够灵活，样式编写需要向 material 学习，增强定制性，优先选择 mixin 编写。我会在之后的文章中介绍 material 的一些设计亮点。

6441 0

Angular 10 正式发布，不再支持 IE910！

这是跨越整个平台（包括框架、Angular Material 和 CLI）的一次主要版本更新。这次的新版发布间隔比以往短一些。自我们发布 Angular 9.0 版以来只过去了四个月。...新版内容新的日期范围选择器 Angular Material 现在提供了一个新的日期范围选择器。 ?...file=src%2Fapp%2Fdate-range-picker-overview-example.html 更多细节请查阅 date range selection： https://next.material.angular.io...CommonJS 或 AMD 依赖项可能导致优化 bailout 可选的更严格设置当你使用 ng new 创建新的工作区时，v10 提供了一个更严格的项目设置选项。...https://v10.angular.io/guide/updating-to-version-10 原文链接 https://blog.angular.io/version-10-of-angular-now-available

2.5K2 0

Angular 6.0 即将发布承诺更小更快更易用

第二个是谷歌将所有的 Angular 源代码放在一个存储库中，这意味着 Angular 的每一个变化都已经在谷歌的超过 500 种产品中使用。...6.0 版本的关键功能是将所有版本的框架结合起来，这意味着核心路由器，平台浏览器，CLI，Angular Material 和其他解决方案的最新版本将一起发布，以便开发人员更好地访问最新版本的 Angular...根据 Angular 的说法，这使得编写异步或基于回调的代码更容易。...“我们想回到平衡稳定性和创新的核心理念上，因此，要在这些工具的工作方式和更新代码方面突破界限。”Fluin 说。...版本 6 的另一个预期功能是用于 Angular Material 和 Component Dev Kit 的树组件。除了 6.0 版之外，该团队正在重写视图引擎并增加对 Bazel 的支持。

9492 0

AngularDart Material Design 应用布局顶

构建样式由包提供：angular_components/app_layout / layout.scss.css。...要在Angular组件中使用这些样式，只需将其添加为Component注解中的styleUrls值即可。建议在任何特定于组件的样式之前添加样式，以便您可以根据需要轻松覆盖样式值。...selector: 'my-component', templateUrl: 'my_component.html', styleUrls: const [ 'package:angular_components.... --> 应用栏和抽屉交互应用栏和抽屉协同工作，为应用程序提供全面的应用布局。应用栏可以存在于material-content之内或之外。...需要在包含组件的styleUrls列表中包含packages：angular_components/app_layout / layout.scss.css。适用于延期内容。

4K3 0

Angular v18 现已推出！

在改进框架的同时，我们确保所有现有的 API 继续按预期工作，并且我们引入 Angular 的所有新内容都有一个很好的互操作性故事。Zoneless 是我们互操作性方法的另一个例子。...去 angular.dev 看看吧！材料 3 现在稳定了！几个月前，我们引入了对 Material 3 的实验性支持。...与此同时，我们还用新的 Material 3 主题和文档刷新了 material.angular.io。您可以在我们的指南中找到如何在您的应用程序中使用 Angular Material 3！...CDK 和 Material 中的水合作用支持在 v17 中，一些 Angular Material 和 CDK 组件被选择退出水合，这导致了它们的重新渲染。...我们正处于世界第二大网站YouTube使用Angular的反应性原语的地方，我们正在作为一个更大的工作组的一部分，将Signals添加到Web平台。

541 0

Angular8稳定版修改概述

但这是如何工作的？基本上，Angular将使用polyfill构建其他文件，并且它们将注入nomodule 属性。...阅读Angular Doc上有关服务工作者的更多信息。表单改进添加了markAllAsTouched方法以标记所有的控件FormGroupas as touched。...@angular/http @angular/http在Angular 5中不推荐使用package，但由于@angular/platform-server依赖于它，所以仍然可用。...您可以运行ng update @angular/core以迁移现有代码。 Angular Material Angular Material工程重命名为Angular Components。...结论以上就是angular 8版本的一些改动。总体来说变化不是很大，延续了angular每年一个稳定版的习惯。原文链接

4.5K2 0

浅谈 Checkbox Group 的双向数据绑定

在实际工作中发现很多组件库关于 checkbox-group 的双向绑定一直很别扭，或者说多多少少都有一些瑕疵。开始本文之前，我们先假定有如下需求： ? 数据列表和输出值都是对象数组。...另外，React 版和 Angular 版的输出值类型也是固定的，其中 React 版输出的是一个关于 value 的字符串数组，Angular 版是则是一个双向绑定 checked 的原数组（个人觉得...Angular 版的绑定比 React 版的要灵活，至少从原数组取值更容易一点）。...也就是说，对于上面展示的这种情况，我们必须要做一些额外的数据处理工作才能完成目标，但是这对于双向绑定功能来说显得有些繁琐。...总结这篇文章拖沓了非常久，一方面是自己工作很忙，另一方面做开源项目占据了大部分时间。

2K1 0

Angular 结合 NG-ZORRO 快速开发

结合 ng-zorro angular 比较流行的 ui 框架有： Angular Material 官方指定 UI 框架 NG-ZORRO，又名 Ant Design of Angular 国内比较流行的...如果你还不了解相关的 angular 主要内容，请先前往文章了解 Angular 开发的内容。...当然你也可以执行 npm install ng-zorro-antd 添加，不推荐。..., Validators } from '@angular/forms'; import { ActivatedRoute, ParamMap } from '@angular/router'; @Component...删除功能我们引入模态对话框进行询问是否删除。

1.7K1 0

Angular 16 正式版发布

2.2 Hydration 和服务端渲染的下一步 v16 中的工作只是一块垫脚石，我们计划在这里做更多的工作。...在 Angular v16 中，我们实现了一个跨越框架、Universal、CDK、Material 和 CLI 的新功能，该功能允许你为 Angular 内联的组件的样式指定 nonce 属性。...Design 团队密切合作，为 Angular Material 的 Web 提供了 Material 3 实现。...我们在 2022 年交付的基于 MDC Web 的组件为这项工作奠定了基础。...作为下一步，我们正在努力在今年晚些时候推出一个基于 expressive token-based 的主题化 API，该 API 支持 Angular Material 组件的更高定制。

2.5K1 0

使用Angular8和百度地图api开发《旅游清单》

我们将收获： Angular8基本用法，架构使用百度地图API实现自己的地图应用解决调用百度地图API时的跨域问题对localStorage进行基础封装，进行数据持久化 material...安装脚手架： npm install -g @angular/cli 复制代码创建工作空间和初始应用 ng new my-app 复制代码安装material UI npm install @angular.../material @angular/cdk @angular/animations 复制代码根据以上架构，建立对应目录文件启动服务 cd my-app ng serve --open 复制代码这里...至此，项目的基本准备工作已经做好了，下面让我们先聊一聊angular。...官方提供的架构图：我们知道，一个完整的angular应该包括：模块 Angular 定义了 NgModule，NgModule 为一个组件集声明了编译的上下文环境，它专注于某个应用领域、某个工作流或一组紧密相关的能力

6K3 0

【前端技术丨主题周】Angular 核心概念与框架演进

方便读者对Angular有个直观的全局认识。本文选自《揭秘Angular 》核心概念 Angular 框架有七大核心概念，它们是Angular 的重要组成部分。 ?...在此之上，还有不少其他的外部工具库，类似于： Angular Material，Google 官方的Material 设计风格的UI 组件库。...除了这些，Angular 周边也有完善的工具体系： Angular CLI 为开发者提供了工作流自动化解决方案。...平台亮点以上内容先后介绍了Angular 核心概念和Angular 平台提供的各种各样的功能，那么Angular 相对于其他前端技术有什么特点呢？...除了上面提到的Material Design UI、Mobile Toolkit，还包括： Kendo UI、Onsen UI 2 等UI 库，提供了多样化的界面方案选择。

9K1 0

Angular vs React 最全面深入对比

OK，开始… … 成熟度作为一名成熟的开发人员或者是能够决定架构及技术走向的人员，一项必备的技能就是能够在工作和项目中平衡成熟技术与最前沿框架之间的关系，既能保持人员及技术的前进，又能保证项目或产品的交付质量...与类似目的的TypeScript不同，它不需要开发人员迁移到新语言，并为你的代码注释类型检查工作。在流程中，类型注释是可选的，可用于向分析器提供其他提示。...当您使用连续数据流（如Web套接字）工作很多的情况下，RxJS非常有用，但是对于其他任何东西来说似乎过于复杂。无论如何，当你使用Angular时，您至少应该了解RxJS的基本知识。...Material design components 如果您热衷于设计Material，您会很高兴听到Angular有一个Material组件库。...Material UI 还有一个可用于React的Material Design Component。与Angular的版本相比，这个版本比较成熟，可以使用更广泛的组件。

3.8K7 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭