问题标签 [angular-material-7]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular-material-6 - StaticInjectorError(AppModule)[MatDialogTitle -> MatDialogRef]
我熟悉这个错误,但我只是在更新到 Angular Material 6.4.7 后才开始看到这个。
我所有的模块都引用了我自己的导出 MatDialogModule 的 MaterialModule。我没有任何 MatDialogRef 提供程序设置 - 以前不需要。
和 [MatDialogTitle -> MatDialogRef] 有什么关系?这意味着什么?
在开发和产品构建中,一切似乎都运行良好。我无法弄清楚是什么原因造成的。
有没有办法将其追溯到某事?
谢谢
font-awesome-5 - 在角材料 7 上使用 font awesome 5
我正在使用 angular 7.0.1 和 angular material 7.0.2,我想添加字体真棒 5.4.2 图标,我正在尝试按照 fontawesome web 上的步骤操作,但我无法获得字体真棒图标字体。
第一的:
然后在styles.scss 中添加:
并在 _variables.scss 添加:
现在在 app.component.ts 添加:
最后我应该用以下方法打印字体真棒图标:
但是字体真棒图标字体永远不会被打印出来。我错过了一些重要而明显的东西,但现在我没有看到它。
angular - 使用具有反应形式的角材料垫选择时出错
我正在尝试将角度材料 mat-select 与反应形式一起使用,并收到错误消息“没有名称的表单控件的值访问器:'productUnitofMeasure'”。
其他 FormControls 在这里工作正常,我在 app 模块中包含了所有必需的模块。
应用程序模块:
模板:
零件:
angular - 如何获取自定义 MatFormFieldControl 以反映无效状态
我一直在关注 angular-material 文档,该文档着眼于创建自定义表单字段控件: https ://material.angular.io/guide/creating-a-custom-form-field-control
它可以方便地跳过模板和反应形式的完整示例,因此我一直在争先恐后地尝试将其全部连接起来。
我已经尝试过了,取得了不同程度的成功。尽管还有其他问题,但我首先想了解如何让这个自定义字段识别它的时间invalid
,以便我可以执行<mat-error>
您在下面看到的操作(我删除了*ngIf
只是这样我可以看到 的状态invalid
)。{{symbolInput.invalid}}
总是,而false
实际上它应该true
是所需的字段!
自定义 MatFormFieldControl 模板使用:
自定义 MatFormFieldControl 类:
符号输入.component.html:
有人会善意地指出我正确的方向吗?
**已更新**
symbolInput.invalid
标志现在在订阅this.ngControl.valueChanges
和设置后设置this.ngControl.control.setErrors
:
如果您认为这可以改进,请告知。
angular - How to add ng-content to multi select component
models:
I am attempting to place an icon in a multi-select component. This icon is place to the right of the group
I have the following component
Note the
transclusion.
Here is how I instantiate the component
I would like the icon to be placed as shown in the graphic
However, I am not seeing the icon anywhere. Any help is appreciated.
Cheers
angular - Angular7 Material7 网格列表项目顺序/流程不随 flex-layout 改变?
我的 html 中有一个 material7 网格列表组件,但我似乎无法改变它的流程。我有编号显示在 2 列中的项目,它们作为行与列流动看起来很奇怪。
起初我遇到了一些问题,所有的瓷砖都消失了,但现在在将所有东西升级到 Material 7 后,它看起来完全一样。
标记:
我还尝试使此功能可以更改所有其他项目的顺序,如下所示:
它有点工作,但也使 Angular 的变更检测生命周期引发了大量的错误。
angular - Angular Material表单控件mat-select --mat-option,设置更新item的默认选项?
我有一个带有垫子选项的垫子选择的表单,我正在构建一个可重用的组件,我可以在其中当场编辑任何项目。我正在尝试填写表单默认值,但是在查看文档 30 分钟并尝试了各种方法之后,我似乎无法以任何方式设置默认选择选项。
我尝试使用该 [selected] 但它只是出错,因为它显然不是输入属性,尽管它确实出现在文档 API 中。
我认为这必须是可能的,否则它只会阻止任何带有 mat-select 的表单来预填充“更新”功能。
我将 Angular Material 7 与 Angular 7 一起使用。
编辑:
我的表单控制代码:
angular - 角材料多选
我对使用 Angular Material 7 多选提出了一些建议。该文档对我正在尝试做的事情没有多大帮助。
关于我正在尝试做的事情的一些背景知识。
所以我们正在创建一个记录对象,作为其中的一部分,我们需要知道是什么项目资助了他们。ProgrammeList 是具有 {ProgrammeKey, Name, Description} 的 Program 对象数组。以前我们使用过单选,效果很好。问题是每个报告都可以由多个项目资助,所以我们需要使用多选。
首先,说到数据库。多选选项将如何保存?这个想法是多选将形成自己的选定对象数组,然后将它们传递回后端以保存在链接表中。
我已经包含以下相关区域的代码
记录.dto.ts
通用组件.ts ...
general.component.html
更新
我遇到的主要问题是 dto 不正确,需要更多值。
有一个新问题,下拉菜单没有被带到视图的前面。而是在活动模型后面。有没有我可以申请的css来解决这个问题?
非常感谢您的帮助
刘易斯
angular - CdkDragDrop 和 ngTemplateOutlet
我正在尝试使用与 Angular Material 7 相关的拖放功能。
我将我的模板分成可重复使用的部分ngTemplateOutlet
,每个选项都可以是Thing ™ 或嵌套的Thing ™,它们有更多的 sub-Things ™。
Nested Things ™ 显示为扩展面板。我希望所有第一级的Things ™ 都可以重新排序,就好像它们是一个列表一样。
(好吧,好吧,很明显这是一个带有正常和嵌套选项的可重新排序的sidenav,只是假装它不是那么明显)
这是我最初编写的代码。
问题:单个Things ™ 是可拖动的,但它们并没有像 cdkDropList 那样强制执行,我可以将它们拖到任何地方。
前段时间我在尝试使用模板出口并将ng-template
s 放回“HTML流”时遇到了类似的问题,可以解决这个问题,所以我也尝试了同样的方法。
而且,当然为什么不呢,它有效!是的,很好,但为什么呢?
没有太大变化,我们使用 angIf
而不是第一个,并删除了ThingngTemplateOutlet
™的上下文绑定,因为由于共享范围,现在两个模板都有其局部变量引用。
那么,为什么它以第二种方式而不是第一种方式工作呢?
加分点:是否有可能让它保持第一个代码结构,在我看来,它显然更易读和更干净?