Question

我的模板中有这部分html来显示或隐藏div。

<div *ngIf="csvVisible">
  <p>Paragraph works</p>
</div>

这是我的组件。

export class SettingsComponent implements OnInit {

  csvVisible: boolean = false;

  private dataSource: string[];

  @ViewChild(MatTable, { static: true }) table: MatTable<any>;

  constructor(private dialog: MatDialog, private templateParserService: TemplateParserService) { }

  ngOnInit() {
    this.templateParserService.subscribe({
      next(result: string[]) {
        if (result !== null) {
          this.dataSource = result;

          if (this.dataSource && this.dataSource.length) {
            this.csvVisible = true;
          } else {
            this.csvVisible = false;
          }
        }
      },
      error(error: Error) {
        console.log(error.message);
      }
    });
  }

尽管DIV在开始时是隐藏的，但它不会自动显示/隐藏csvVisible值更改。观察者发出数据时，csvVisible的值已正确设置。 [hidden]="csvVisible"也不起作用。

编辑：

该服务上的订户注册是通过以下代码完成的。

  private subject = new Subject<string[]>();

  public subscribe(observer: any): Subscription {
    return this.subject.subscribe(observer);
  }

Answer 1

由于您在订阅中使用对象，因此此指向当前的订阅对象，而不是尝试使用subscribe（{next：（）}）

component.ts

 this.templateParserService.subscribe((result: string[])=>{
            if (result !== null) {
                 this.dataSource = result;
               if (this.dataSource && this.dataSource.length) {
                 this.csvVisible = true;
              } else {
                 this.csvVisible = false;
              }
            }
    },(error: Error)=>{
            console.log(error.message);
    });

角度指令* ng如果未按预期工作

1 个答案: