Question

你好，我想将数字从组件传递到另一个，并且我正在使用@input。

这是我的父组件：

@Component({

    selector: 'inter-asp',
    styleUrls: [('./asp.component.scss')],
    templateUrl: './asp.component.html',
    template: '<app-my-dialog [hellovariable]="hellovariable"></app-my-dialog>',
    providers: [PaginationConfig],
})

export class aspComponent implements OnInit {
    public hellovariable: number = 100;

}

这里是我的孩子部分：

 @Component({
      selector: 'app-my-dialog',
      templateUrl: './my-dialog.component.html',
      styleUrls: ['./my-dialog.component.css']
    })
    export class MyDialogComponent implements OnInit {

      @Input() hellovariable: number;
}

在子组件中，我想显示从父组件传递的变量hellovariable的内容，但是我不确定，它没有传递，所以这里出了什么问题。

Answer 1

它优先使用模板网址，删除该部分并将其作为

@Component({
    selector: 'inter-asp',
    styleUrls: [('./asp.component.scss')],
    template: '<app-my-dialog [hellovariable]="hellovariable"></app-my-dialog>',
    providers: [PaginationConfig],
})

STACKBLITZ DEMO

Answer 2

在父模板中，您必须将输入作为子组件的属性传递给子

<app-child-component [prop]="prop"></app-child-component>

使用角度8中的@input装饰器将数据从父组件传递到子组件

2 个答案: