我是Angular 2和TypeScript的新手，我正試圖在代碼中使用我的另一個組件viz頭中的Test類的變量。如何在角度2中導入另一個組件中的類？

import { Component } from '@angular/core'; 
@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
} 
export class Test{ 
static var1:number=10; 
}

var1是靜態的，因爲我想在不使用測試實例的情況下使用它。

代碼在頭即

import { Component, OnInit } from '@angular/core'; 
import {Test} from '../app.component'; 
@Component({ 
    selector: 'app-header', 
    Template;`<h1> Hello</h1> 
      <h1>{{Test.var1}}</h1>` 
}) 
export class HeaderComponent implements OnInit { 
    constructor() { } 

    ngOnInit() { 
    } 

}

該代碼僅示出你好不是「10」，這是一個靜態變量的另一種組分。

預先感謝您。

來源

2017-04-12 Pulkit Aggarwal

import { Component, OnInit } from '@angular/core'; 
import {Test} from '../app.component'; 
@Component({ 
    selector: 'app-header', 
    Template:`<h1> Hello</h1> 
      <h1>{{test.var1}}</h1>` 
}) 
export class HeaderComponent implements OnInit { 
    constructor(private test: Test) { } 

    ngOnInit() { 
    } 

}

誤區

使用template不Template
使用:不;模板後
使實例構造函數

來源

2017-04-12 10:33:02

這還沒有工作 –

現在有什麼問題？控制檯錯誤？ –

我將對象obj設爲obj = new Test（）; 和

obj.var1

用於模板但沒有顯示我10作爲輸出 –

這裏是另一種方式：

import { Component, OnInit } from '@angular/core'; 
import { Test } from './app.component'; 
@Component({ 
    selector: 'app-header', 
    template: `<h1> Hello</h1><h1>{{var1}}</h1>` 
}) 
export class HeaderComponent implements OnInit { 
    var1 = Test.var1; // place static var into local var 
    ngOnInit() { 
    } 
}

來源

2017-04-12 16:05:46

這是行得通的，但爲什麼我們無法直接訪問它。 –

請參閱以下答案：http：// stackoverflow。com/a/39193573看起來該模板的作用域是組件實例，因此它無法訪問全局變量或靜態變量。在我看來這是一件好事。全球國家通常應該避免。 –

所以，即使你不希望實例測試的情況下，你仍然需要使用您的組件的實例屬性。

在您的組件中，只需將Test類綁定到一個實例屬性，然後在模板中訪問該屬性即可。

test = Test;

訪問這與模板：

{{ test.var1 }}

來源

2017-04-13 06:00:01 Martin

您設置的變量爲公共的。您已將Test初始化爲私有財產。因此它的範圍就在組件內部而不在模板上。

來源

2017-07-27 18:58:25

如何在角度2中導入另一個組件中的類？

回答

obj.var1

相關問題