简体   繁体   English

当模板中的数组值为空或长度=== 0时,如何显示输入框?

[英]How can i show input boxes when the array values are empty or length === 0 in my template?

I am showing the values base on user enters in inputbox So it is in format of array of arrays I mean array inside arrays for example(['str',[]] So I am looping in my component.html file and render data in input box So my issue is if array values are empty So i need to show empty input box which is not happening my case How can i keep a check so that if value is empty also I can show input box 我正在显示基于用户在inputbox中输入的值,因此它是数组数组的格式,我的意思是数组内的数组,例如(['str',[]]因此,我循环了我的component.html文件,并在输入框因此,我的问题是数组值是否为空,所以我需要显示没有发生这种情况的空输入框。如何保持选中状态,以便如果值也为空,我也可以显示输入框

            <div class="row">
              <span class="col-2 align-self-center firstletter">{{ a[0] }}</span>
              <div class="col-4"><label for="startTime">Start Time
                  <span class="red-star">*</span>
                </label></div>
              <div class="col-4"><label for="endTime">End Time
                  <span class="red-star">*</span>
                </label></div>
            </div>
              <div class ="test" *ngIf="a[1].length == 0">
                <p>No opening hours</p>
              </div>
            <div class="row" *ngFor="let m of a[1]; let j = index">
                <span class="col-2 align-self-center"></span>
              <div class="col-4">
                <input type="text" name="startTime" 
                  class="form-control cust-input-class form-control-sm mt-1 col-10 d-inline" [value]="m[0] === undefined ? '': m[0] "
                  (change)="onStartChangeValue($event.target.value,m, m[0])" /> 
                <!-- [ngModel]="m?.startTime" -->
              </div>
              <div class="col-4">
                <input type="text" name="endTime"
                  class="form-control cust-input-class form-control-sm mt-1 col-10 d-inline" [value]="m[1] ===  undefined ? '':m[1]"
                  (change)="onEndChangeValue($event.target.value,m, m[1])" />
                <!-- [ngModel]= "m?.endTime" (ngModelChange)="m.endTime = $event"  -->
              </div>
              <div class="col-2 align-self-center" *ngIf="j == 0">
                <span class="add-item-icon" (click)="o2editaddTime(k)"></span>
              </div>
              <div class="col-2 align-self-center" *ngIf="j > 0">
                <span class="remove-item-icon" (click)="o2editremoveTime(k, j)"></span>
              </div>
            </div>
            <!-- </div> -->
          </div>

        </div>

You can put the two input box with opposite condition 您可以将两个输入框置于相反的状态

<input type="text" name="hey" *ngIf="array.array">{{ Any thing }}
<input type="text" name="hey" *ngIf="!array.arrayy" >

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 切换 HTML 选择框值时如何隐藏/显示 HTML 输入框? - How do I hide/show HTML input boxes when I toggle HTML Select box values? 单击输入框时,需要显示我的段落。 我的p数组如何不循环遍历我的段落变量? - I need my paragraph to display when clicking on my input boxes. How is my p array not cycling through my paragraph variables? 如何在输入框中显示值 - How to make values show up in input boxes 我如何从表单提交的多个输入框中获取值并将这些值作为对象存储在React的状态数组中? - How can i get values from multiple input boxes on form submit and store the values as an object in an state array for React? 如何防止数组中的空字符串算作长度的一部分? - How can I prevent empty strings in my array from counting as a part of length? 检查输入框数组是否为空 - Checking an array of input boxes are not empty 在 postman 测试中,当输入参数可以为空时,如何使用多个值之一断言响应值? - In postman tests, how can i assert the response values with one of multiple values when the input parameter can be empty? 当输入为空数组时,如何从 function 返回消息“这是空的”? - How can I return the message “this is empty” from a function when the input is an empty array? 输入类型“文件”不为空时,如何在JS中显示按钮类型? - How can I Show in JS the button type when the input type “file” is not empty? 当输入空查询时,如何使表单输入不返回任何结果? - How can I make my form input not return any results when it is inputted with an empty query?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM