可變可用性，function 聲明

Question

我在訪問 Angular 項目中定義的變量時遇到問題。 我是新手，但請耐心等待。 我的項目如下所示：

app.component.html：

<div>
<ul>
  <li *ngFor='let var1 of Fcomponent' >{{var1}}</li>
</ul>
</div>

app.component.ts：

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

變量1.component.ts：

import { Injectable } from "@angular/core";
@Injectable({
  providedIn:'root'
})
export class Variables1Service{
  Fcomponent: number[]=[0,1,2,3,4,5,6,7,8,9];
}

變量1.service.ts：

import { Injectable } from "@angular/core";
@Injectable({
  providedIn:'root'
})
export class Variables1Service{
  Fcomponent: number[]=[0,1,2,3,4,5,6,7,8,9];
}

app.module.ts：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { Variables1Service } from './variables1.service';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [Variables1Service],
  bootstrap: [AppComponent]
})
export class AppModule {}

現在我收到以下錯誤：

不能獲取 /。 錯誤：src/app/app.component.html:3:27 - 錯誤 TS2339：“AppComponent”類型上不存在屬性“Fcomponent”。

3 <li *ngFor='let var1 of Fcomponent' >{{var1}}

如何讓它工作？

Answer 1

在 app.component.ts 里面：

export class AppComponent {
  title = 'project';

需要添加以下代碼：

  private variables1Service:Variables1Service;

  constructor (){
    this.variables1Service=new Variables1Service();
  }

  get Fcomponent() {
    return this.variables1Service.Fcomponent;
  }

一切都開始正常工作。