Question

这里我有两个组件，比如DummyComponent和LoginComponent i wana 2将数据从登录传递给Dummy

的 DummyComponent.ts

@Component({
    selector: "Dummy-Selector",
    template: `<div>
    <p>This is Dummy</p>
    <input type="text" value="{{sampleData}}"  ([ngModel])="sampleData" />
</div>`
})
export class DummyComponent {
    @Input() IncommingData: string;

LoginComponent

export class LoginComponent {
    sampleData: string = "Login Components...";

LoginComponent.html 这里我要将sampleData从LoginComponent传递给DummyComponent

 <div>
        <input type="text"  value="{{ sampleData }}" [(ngModel)]='sampleData'>
        <b>data from child</b>
             <Dummy-Selector [IncommingData]="sampleData" (childData)='handleEvent($event)' [(ngModel)]="sampleData">

                </Dummy-Selector>
    </div>

Answer 1

在你的dummyComponent中你应该绑定 IncommingData 而不是 sampleData

@Component({
    selector: "Dummy-Selector",
    template: `<div>
    <p>This is Dummy</p>
    <span>{{IncommingData}}</span>
    <input type="text" [(ngModel)]="IncommingData" />
</div>`
})

如何使用@Input

1 个答案: