Question

我想在子组件中获取“用户”变量值的值。

感谢帮助！

Answer 1

您可以将for iOS Use timer in Swift var timer = Timer() self.timer = Timer.scheduledTimer( timeInterval: 1.0, target: self, selector: #selector(self.callFunction), userInfo: nil, repeats: true) //time interval is in seconds func callFunction(){ //this method will be called repeatedly after every 1 sec } timer.invalidate() //to stop timer对象作为user传递给子组件。

班级：

@Input

模板：

export class ChildComponent implements OnInit{

  @Input() user: SocialUser;

}

Answer 2

您可以使用3种方式将值从父级转移到子级

使用输入在父.html文件中

<app-child [user]="user"></app-child>

和child.ts文件

export class ChildComponent implements OnInit{
  @Input() user: SocialUser;
}

使用简单存储 storage.service.ts

public user: String = '';

现在将此项服务导入module.ts文件，并在parent.ts中导入存储服务

constructor(public storageService: StorageService){}
ngOnInit(){this.storageService.user = 'user_value';}

在child.ts文件中

constructor(public storageService: StorageService){}
ngOnInit(){console.log(this.storageService.user);}

使用可观察的在storage.service.ts

public user: Subject<any> = new BehaviorSubject<any>(null);

现在将此项服务导入module.ts文件，并在parent.ts中导入存储服务

constructor(public storageService: StorageService){}
ngOnInit(){this.storageService.user.next('user_value')}

在child.ts文件中

constructor(public storageService: StorageService){}

ngOnInit(){
   this.storageService.user.subscribe(user=> {if(user) console.log(user)});
}

Answer 3

将父组件注入子组件。

https://angular.io/guide/dependency-injection-navtree

文档清楚地显示了示例。

Answer 4

在Angular中，您可以使用以下方法将数据从父级传递给子级： @Input装饰器。

第1步：父组件

import { Component, OnInit } from '@angular/core';
@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent implements OnInit  {
  user:string;
  ngOnInit(): void {
    this.user='sanjay'
  }
 }

第二步：子组件

import { Component, Input } from '@angular/core';
@Component({
  selector: 'app-test',
  template:'<h1>{{user}}</h1>',
  styleUrls: ['./test.component.scss']
})
export class TestComponent {
   @Input() user:string;
}

Answer 5

如果您的父母与孩子之间没有直接关系，则可以向您的孩子注入相同的服务，并像在父母那里一样获得users数据

如果他们有关系-您可以使用component属性

将数据传递给子@Input()选择器

loginHandler.component.html

<app-profile-handler [childUser]="user"></app-profile-handler>

profileHandler.component.ts

export class ProfileHandlerComponent {
   @Input() childUser: SocialUser;
}

希望这对您有所帮助-编码愉快：）

如何将变量值从父ngOnint（）组件传递给子组件？

5 个答案: