时间戳

首页 > 解决方案 > 检查html中的空角度对象

html - 检查html中的空角度对象

问题描述

我试图在对象是否为空的情况下禁用按钮。在这种情况下，对象selectedTopics应该等于 {}

注册.ts

ngOnInit() {
    this.topicRequestAnswer = {topics:[]};

    this.selectedTopics = {};  // <- setting equal to {} here
    this.requestTopics();
  }

注册.html

<ion-content class="ion-padding">

  <form #form="ngForm" (ngSubmit)="register(form)">
    <ion-grid>
      <ion-row color="primary" class="ion-justify-content-center">
        <ion-col class="ion-align-self-center" size-md="6" size-lg="5" size-xs="12">
          <div class="ion-text-center">
            <h3>...</h3>
          </div>
          <div class="ion-padding">
            <ion-item>
              <ion-input [(ngModel)]="email" name="email" type="email" placeholder="E-Mail" ngModel required></ion-input>
            </ion-item>
            <ion-item>
              <ion-label>Choose a topic</ion-label>
              <ion-select [(ngModel)]="selectedTopics" name="topics" multiple="true" ngModel required>
                <ion-select-option *ngFor="let topic of topicRequestAnswer.topics" value="{{topic}}" class="ion-text-justify" ngModel required>{{topic}}</ion-select-option>
              </ion-select>
            </ion-item>
            <ion-item>
              <ion-input [(ngModel)]="name" name="username" type="username" placeholder="Username" ngModel required></ion-input>
            </ion-item>
            <ion-item>
              <ion-input [(ngModel)]="password" name="password" type="password" placeholder="Password" ngModel required></ion-input>
            </ion-item>
          </div>
          <div class="ion-padding">
            <ion-button size="large" type="submit" [disabled]="form.invalid || selectedTopics == {}" expand="block">Sign Up</ion-button>  // <- the [disabled] condition fails here
          </div>
        </ion-col>
      </ion-row>
    </ion-grid>
  </form>

当我回显空的 $topics 变量时，我的 php 脚本中的输出是

[object Object]

如果没有选择任何主题，我如何需要更改条件以禁用按钮？

标签： htmlangularionic-framework

解决方案

即使你的条件是错误的this.selectedTopics = {};

因为基本原则{} == {}也返回假，所以你的条件也会[disabled] = selectedTopics == {}

一种检查方法是：

Object.keys(this.selectedTopics).length === 0

要签入 html：

(selectedTopics | json) == '{}'

推荐阅读