无法绑定到'HiddenFlag'，因为它不是'app-fog'的已知属性

我想用@Input在子组件和父组件之间共享一个变量。我在我的父组件声明public HiddenFlag: Boolean = true;和在HTML我称这样的孩子：无法绑定到'HiddenFlag'，因为它不是'app-fog'的已知属性

<app-fog [hidden] = "HiddenFlag" [HiddenFlag] = "HiddenFlag"></app-fog>

的App-雾是我的孩子组成：

import { Component, OnInit, Input } from "@angular/core";` 

@Component({ 
    selector: "app-fog", 
    templateUrl: "./fog.component.html", 
    styleUrls: ["./fog.component.css"] 
}) 

export class FogComponent implements OnInit { 

    @Input() public HiddenFlag: Boolean; 

    public fogClass: String; 
    public OverlayClass: String = "hidden"; 

    constructor() { } 

    ngOnInit() { } 

    Close() { 
     this.HiddenFlag = true; 
    } 
}

的问题是，如果我尝试加载网站，它说：

Uncaught Error: Template parse errors: Can't bind to 'HiddenFlag' since it isn't a known property of 'app-fog'

如果我删除[HiddenFlag] = "HiddenFlag"错误消失。如果你能提供任何帮助，将不胜感激。

编辑：Thx所有的答案。说实话，我仍然不知道问题是什么，但这个问题不知怎么解决了。

来源

2017-06-28 Nikolai

这是'boolean'，不'Boolean'。而'string'，而不是'String'。如果组件本身无法访问，也可能因为它未包含在模块中而发生此问题。作为一个手段性的问题，避免使用大写的属性名称。大写的标识符意味着指代类。 –

您是否在相关模块声明中包含了“FogComponent”组件？ –

是的，我有他们都在同一模块以及。 – Nikolai

删除public。试试：@Input() HiddenFlag: Boolean;。

来源

2017-06-28 12:26:49

我相信你的意思是'boolean'，而不是'Boolean'。清除公众并不能解决任何问题。 –

是的，我试过了，它没有帮助。 – Nikolai

这听起来像一个模块问题。 Angular不知道app-fog选择器的定义。您的FogComponent可能未在您的模块的declarations列表中列出。

@NgModule({ 
    declarations: [FogComponent, ...], 
    ... 
}) 
export class YourModule {}

另外，如果父母和孩子都在不同的模块，你需要输入孩子的模块父母的模块和出口孩子自己的模块中。

@NgModule({ 
    imports: [ChildModule, ...], 
    ... 
}) 
export class ParentModule {} 


@NgModule({ 
    declarations: [FogComponent, ...], 
    exports: [FogComponent, ...], 
    ... 
}) 
export class ChildModule {}

https://angular.io/guide/ngmodule

来源

2017-06-28 12:38:48 awiseman

这两个组件都在同一个ngModule中声明，所以这不是问题。 – Nikolai

@尼古拉啊，好的。那么，在这种情况下，我只会同意@torazaburo，并建议您在输入字段中尝试没有大写的第一个字符。我做了一个示例应用程序来尝试它，它似乎有所作为，虽然我没有产生错误信息（它只是没有工作）。他也是正确的，'boolean'和'string'类型也没有大写。 – awiseman

试过，但也是没有运气。 – Nikolai

无法绑定到'HiddenFlag'，因为它不是'app-fog'的已知属性

回答

相关问题