Angular @Input不适用于引导程序组件 [英] Angular @Input is not working with bootstrap component

查看:82
本文介绍了Angular @Input不适用于引导程序组件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在Angular2类中犯了一个错误,并且对 @Input 不清楚.

I did a mistake in my Angular2 class and I've not clearly understood about @Input.

我创建了两个组件AppComponent和AppDetailComponent.

I created 2 components AppComponent and AppDetailComponent.

在AppDetailComponent中:

In AppDetailComponent :

import { Component, Input } from '@angular/core';


@Component ({
selector: 'app-detail',
template: 'Hi {{datainput}}'
})

export class AppDetailComponent {

@Input()
datainput: string;

}

并在AppComponent模板中:

and in AppComponent template :

<h1>
  {{title}}
</h1>
<app-detail [datainput]="'test'"></app-detail>

在App Module中,我通过添加AppDetailComponent作为引导程序组件而犯了一个错误

and in App Module I made a mistake by add AppDetailComponent as bootstrap component

import { AppComponent } from './app.component';
import { AppDetailComponent } from './app-detail.component';

@NgModule({
  declarations: [
    AppComponent, AppDetailComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent, AppDetailComponent]
})
export class AppModule { }

从引导列表中删除AppDetailComponent后,程序运行正常.

After I removed AppDetailComponent from the bootstrap list, program was working correctly.

我不明白 将@input用作引导程序组件时,为什么@input不能正常工作?

I don't understand why @input dose not working when I use it as bootstrap component?

尽管我从其他角度组件发送输入,但Angular会始终忽略输入属性吗?

Will Angular always ignore input property in spite of I send the input from an other angular component?

推荐答案

@Inputs()只能绑定在组件的模板中.自举组件位于任何其他组件之外的index.html中,因此无法绑定到输入.

@Inputs() can only be bound in templates of a component. Bootstrapped component are in index.html outside of any other component and therefore there it's not possible to bind to inputs.

另请参见 Angular 2外部输入

如果index.html中没有匹配的选择器,并且不想将某个组件用作根组件,则不要将其添加到bootstrap: [...]

If you don't have a matching selector in index.html and don't want to use a component as root component, then don't add it to bootstrap: [...]

这篇关于Angular @Input不适用于引导程序组件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆