如何在Angular2中使用另一个组件中的变量

时间:2017-02-07 18:40:48

标签: angular components

我想知道是否可以使用从一个组件到另一个组件的变量值而不必使用第一个组件的模板,只需要变量的值就不用了。有可能吗?

3 个答案:

答案 0 :(得分:7)

是的,您可以使用@Input()方法或使用下面的写入方法

export class Demo {
    const sum = 10;

    get SumValue() {
        return this.sum;
    }
}

导入 - >演示

export class Demo2 {
   private sum: number;
   this.sum = Demo.SumValue();
}

答案 1 :(得分:2)

转到您的app.module.ts并使您想要与其他类一起继承的组件的提供程序:

然后转到要访问该变量的类,然后将组件导入其中:

为其构造函数:

愉快地访问变量:

答案 2 :(得分:1)

我正在开发一个东西,我也面临着同样的挑战。 我的方法。

我有两个不同的组件和一个服务。

loginComponent,headerCompnent和一个loginauth服务。

    validateUser(name,pass){

   this.loginStatus = this.loginauth.validateUser(name,pass);

   if(this.loginStatus) this.route.navigate(['/welcome']);
   else this.route.navigate(['/login']);

  }

image from LoginComponent

我想在headerComponent中使用“ loginStatus ”。

this.loginauth.validateUser(name,pass); 是loginauth是其中的服务和validateUser(...)方法。

因此,我在服务内部创建了一个 static 变量,并将该服务注入两个组件中,并通过在headerComponent中注入相同的服务,我能够检索到该值静态变量。

在使用中,根据需要创建并初始化它。

static loginFlag = false;

loginAuth service img

在标题组件中。

导入该服务并使用类名称访问该静态变量。

 LoginAuthService.loginFlag

headerComponent img