繁体   English   中英

在javascript中用逗号分隔元素

[英]separate elements with a comma in javascript

这是输入:

scheduleInput = { schedulefor: "weekdays" , weekdays: "" , days:""}

这是TS档案

onChangeCheckWeek(week:any ,  isChecked: boolean) {
  if (isChecked) {
    this.checkAll = false;
    this.scheduleInput.weekdays= this.scheduleInput.weekdays + week; 
    // The weekdays are stored in this.scheduleInput.weekdays and week is having the newly slected checkbox
    week.split(/[ ,]+/);
  } else {
    this.checkAll = false;
    this.selectAllWeekDays= false;
  }
}

这是HTML:

<div class="Schedule container-fluid" *ngIf="scheduleInput.schedulefor == 'weekdays'">
  <div class="my-info-1 row weekday">
    <h4 class="mgtop-15">
      Weekly :
    </h4>
  </div>
  <div class="row">
    <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0 warning">
      <input type="checkbox" id="rem"  class="custom-control-input" [checked]="checkAll" (change)="onChangeCheckAll($event.target.checked)" [(ngModel)]="selectAllWeekDays">
      <span class="custom-control-indicator"></span>
      <span class="custom-control-description"></span>
      Select All
    </label></div>
    <div class="row mgtop-5">
     <div class="col-sm-4 ">
        <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
          <input type="checkbox" id="rem"  class="custom-control-input"  [checked]="checkAllWeek" (change)="onChangeCheckWeek('Monday', $event.target.checked)"   [value]="Monday" >
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description"></span>
          Monday
        </label>
      </div>
      <div class="col-sm-4">
        <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
          <input type="checkbox" id="rem"  class="custom-control-input" [checked]="checkAllWeek" (change)="onChangeCheckWeek('Tuesday', $event.target.checked)" [value]="Tuesday"  >
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description"></span>
          Tuesday
        </label>
      </div>
      <div class="col-sm-4  ">
        <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
          <input type="checkbox" id="rem"  class="custom-control-input" [checked]="checkAllWeek" (change)="onChangeCheckWeek('Wednesday', $event.target.checked)" [value]="Wednesday">
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description"></span>
          Wednesday
        </label>
      </div>
    </div>
    <div class="row mgtop-5">
      <div class="col-sm-4  ">
        <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
          <input type="checkbox" id="rem"  class="custom-control-input" [checked]="checkAllWeek" (change)="onChangeCheckWeek('Thursday', $event.target.checked)" [value]="Thursday">
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description"></span>
          Thursday
        </label>
      </div>
      <div class="col-sm-4  ">
        <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
         <input type="checkbox" id="rem"  class="custom-control-input" [checked]="checkAllWeek" (change)="onChangeCheckWeek('Friday', $event.target.checked)" [value]="Friday" >
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description"></span>
          Friday
        </label>
      </div>
      <div class="col-sm-4 ">
        <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
          <input type="checkbox" id="rem"  class="custom-control-input"  [checked]="checkAllWeek" (change)="onChangeCheckWeek('Saturday', $event.target.checked)"  [value]="Saturday">
            <span class="custom-control-indicator"></span>
            <span class="custom-control-description"></span>
            Saturday
          </label>
        </div>
      </div>
      <div class="row mgtop-5">
        <div class="col-sm-4 ">
          <label class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
            <input type="checkbox" id="rem"  class="custom-control-input"  [checked]="checkAllWeek" (change)="onChangeCheckWeek('Sunday' , $event.target.checked)"  [value]="Sunday">
            <span class="custom-control-indicator"></span>
            <span class="custom-control-description"></span>
            Sunday
          </label>
        </div>
      <div class="col-sm-8 mgtop-5"></div>
    </div>
  </div>

当我检查在一周中存储的复选框后,在控制台中检查工作日时,它显示为;

MondayTuesdayWednesday....

我希望它显示为

Monday, Tuesday, Wednesday...

我也希望它以相同的顺序显示,即使首先选择了星期六,然后又选择了其他工作日。 您的帮助将不胜感激。

您可以在当前结果上使用RegEx /[AZ][az]+/g分割大写字母,如下所示:

 var days = 'MondayTuesdayWednesday' days = days.match(/[AZ][az]+/g).join(', '); console.log(days); 

这将达到目的:

var week="MondayTuesdayWednesdayThursdayFridaySaturdaySunday";
var str=week.match(/[A-Z]*[^A-Z]+/g).join(', ');
console.log(str);

暂无
暂无

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

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM