angular - 无法绑定到“dividerColor”,因为它不是“mat-form-field”的已知属性
问题描述
我创建了一个 Angular 应用程序并成功编译它:
10% building 3/3 modules 0 activei 「wds」: Project is running at http://localhost:4200/webpack-dev-server/
i 「wds」: webpack output is served from /
i 「wds」: 404s will fallback to //index.html
chunk {main} main.js, main.js.map (main) 163 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 399 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.09 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 186 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 7.95 MB [initial] [rendered]
Date: 2019-11-15T07:04:24.466Z - Hash: 14ff089b7b0356766301 - Time: 16736ms
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
i 「wdm」: Compiled successfully.
但是当我去时,http://localhost:4200
我在浏览器选项卡中只看到应用程序的名称和徽标,但在内容位置看到一个空白页。我可以在此地址上运行其他应用程序,但这个新应用程序不起作用并显示任何内容。
您可以在此处找到项目文件:https ://github.com/rajishpajish/test
编辑:我检查了开发人员控制台作为建议的答案,并发现此错误消息:
Uncaught Error: Template parse errors:
Can't bind to 'dividerColor' since it isn't a known property of 'mat-form-field'.
1. If 'mat-form-field' is an Angular component and it has 'dividerColor' input, then verify that it is part of this module.
2. If 'mat-form-field' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("
<p>
<mat-form-field class="full-width"
[ERROR ->]dividerColor="{{(formErrors.author) ? 'warn' : 'primary'}}">
<input matInput formControlNa"): ng:///AppModule/DishDetailComponent.html@62:9
Can't bind to 'dividerColor' since it isn't a known property of 'mat-form-field'.
1. If 'mat-form-field' is an Angular component and it has 'dividerColor' input, then verify that it is part of this module.
2. If 'mat-form-field' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("
<p>
<mat-form-field class="full-width"
[ERROR ->]dividerColor="{{(formErrors.comment) ? 'warn' : 'primary'}}">
<textarea matInput formContr"): ng:///AppModule/DishDetailComponent.html@75:9
at syntaxError (compiler.js:2175)
at TemplateParser.parse (compiler.js:11188)
at JitCompiler._parseTemplate (compiler.js:25721)
at JitCompiler._compileTemplate (compiler.js:25709)
at compiler.js:25653
at Set.forEach (<anonymous>)
at JitCompiler._compileComponents (compiler.js:25653)
at compiler.js:25566
at Object.then (compiler.js:2166)
at JitCompiler._compileModuleAndComponents (compiler.js:25565)
由于我是一个新的 Angular 学习者,不知道这个模块是否已被弃用以及如何用新模块替换它?
解决方案
如果您打开开发者控制台,您会看到其中一个模板 (DishDetailComponent.html@75:9) 中有错误:
如您所见,它抱怨组件中没有dividerColor
属性mat-form-field
。也许这是一个已弃用的属性,因为我在其 API 中看不到它:https ://material.angular.io/components/form-field/api
推荐阅读
- python - 如何使用存储在 AWS S3 存储桶中的 python 库作为 AWS lambda 中的 zip 文件
- python - Python Scrapy table web 抓取表格行之外的数据
- python-3.x - 在函数内部定义变量
- cloud - IP Oracle 云实例 VM 的问题
- typescript - 添加打字稿以响应本机应用程序后的错误
- string - 使用OCaml在字符串中嵌套引号?
- yarnpkg - 纱线链接和生产建设
- ffmpeg - 我可以使用哪些 ffmpeg 过滤器来实现缩小视频并保持原始纵横比?
- c - Visual Studio 中的 C 编程 - 转到定义说明
- python - 我的用于 python 跳棋游戏的 AI 算法是否有效,如果没有,我应该考虑其他什么?