1

私は夢中になっています。新しいコンポーネントを作成しましたが、彼は正常に動作しています。これを2つのページで使用したいと思います。

次に、次のようなコンポーネント モジュール (/components/all-components.module.ts) を作成しました。

import { NgModule } from '@angular/core';
import { TagsComponent } from './tags/tags.component';
import { IonicModule } from '@ionic/angular';


@NgModule({
  imports: [IonicModule],
  declarations: [
    TagsComponent
  ],
  exports: [
    TagsComponent
  ]
})

export class AllComponentsModule {}

app.module.ts に AllComponentsModule を追加し、2 ページ モジュールに同じものを追加しました。

これで、テキストまたは変数を表示しているときにコンポーネントが正常に動作し、console.log がデータを返しますが、*ngFor何も使用しない場合は表示されません。

最後に、これが私のコンポーネントです

import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-tags',
  templateUrl: './tags.component.html',
  styleUrls: ['./tags.component.scss'],
})
export class TagsComponent implements OnInit {

  @Input() userTags: any;

  constructor() {
  }

  ngOnInit() {
      console.log(this.userTags);
  }
}

そしてビュー:

<p>hi</p>
<div *ngFor="let tag of userTags">
  <p>{{tag?.name}}</p>
</div>

画面

4

1 に答える 1