1

我快疯了，我创建了一个新组件，他工作正常。现在我想在两页上使用它。

然后我创建了一个组件模块（/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

3

好的，我不明白为什么，但是如果我使用模块来存储所有组件。在我的all-components.module.ts我必须把CommonModule解释*ngFor，*ngIf等。

使用 CommonModule 导入一切正常！

这是更新的代码：

import { NgModule } from '@angular/core';
import { TagsComponent } from './tags/tags.component';
import { CommonModule } from "@angular/common";

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

export class AllComponentsModule {}
于 2020-03-21T21:47:08.813 回答