Anglejs2의 구성요소 간에 값을 전송하는 방법의 예

AngualrJs2의 공식적인 방법은 @Input, @Output을 사용하여 구성 요소 간의 상호 값 전송을 구현하는 것이며, 구성 요소 간에는 부모-자식 관계가 있어야 합니다. 다음은 간단한 방법입니다. 구성 요소 간의 값 전송을 실현합니다. 상위-하위 구성 요소뿐만 아니라 교차 모듈 구성 요소도 값 전달을 실현할 수 있습니다

/**
 *1.定义一个服务，作为传递参数的媒介
 */
@Injectable()
export class PrepService{

  //定义一个属性，作为组件之间的传递参数，也可以是一个对象或方法    
  profileInfo: any;
  
  }

 /**
 *2.传递参数的组件，我这边简单演示，直接就在构造器里面实现传参了
 */ 
@Component({
  selector: 'XXXXXXX',
  templateUrl:"./XXXXXX.html",
  styleUrls:["./XXXXXXX.css"]
})

export class ReportComponent {

  //定义要传递的参数(此处是一个对象，也可以是方法)        
  reponsePrep:any ={
    name : "腊肉豆皮",
    address："中欧五花肉"
  }

  //构造器注入PrepService服务    
  constructor(private ps:PrepService){
    //把当前组件参数赋值给PrepService的profileInfo属性
    ps.profileInfo = this.reponsePrep;
  }
 }

  /**
 *3.接受参数的组件
 */ 
@Component({
  selector: 'YYYYYY',
  templateUrl:"./YYYYYYYY.html",
  styleUrls:["./YYYYYYY.css"]
})

export class commandComponent {

  //定义参来接收来自PrepService服务profileInfo属性的值
  requestPrep:any; 

  //构造器注入PrepService服务    
  constructor(private ps:PrepService){
    //把PrepService的profileInfo属性的值赋值给requestPrep实现组件的之间的传值
    this.requestPrep = ps.profileInfo;
  }
 }

아이디어: 서비스를 매개 변수 전달을 위한 매체로 정의하고 이를 생성자에 주입합니다. 전달될 컴포넌트를 서비스에 추가합니다. 속성(매개변수 전송 매체)을 사용하여 값을 할당하고 획득하여 컴포넌트 간 매개변수 전송을 구현합니다.

위 데모는 간단한 아이디어를 제공하기 위한 것입니다. , 자유롭게 플레이 가능

[관련 추천]

1. 특별 추천: "php Programmer Toolbox" V0 .1 버전 다운로드

2 . 무료 js 온라인 비디오 튜토리얼

3.

php.cn Dugu Jiujian (3) －JavaScript 비디오 튜토리얼

위 내용은 Anglejs2의 구성요소 간에 값을 전송하는 방법의 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!