如何在角度切换单选按钮?

时间:2018-07-13 08:28:37

标签: html angular typescript angular2-template angular2-forms

HTML文件

 <div class="col-sm-4" *ngFor='let p of products;'>
  <div class="panel panel-light-grey border-grey">
    <div class="panel-heading border-grey">
      <div class="radio clip-radio radio-primary radio-lg ">
        <input type="radio" id="{{p.id}}" ngControl="selectedProduct" (ngModelChange)="selectProduct($event, p)" [(ngModel)]="p.selected"
          formControlName="selectedProduct" value={{p.id}}>
        <label for="{{p.id}}">
          <span class="panel-title text-azure text-extra-large" tooltip="{{p.product.title}}" placement="bottom">{{(p.product.title.length>24)? (p.product.title | titlecase | slice:0:24)+'..':(p.product.title | titlecase) }}</span>
        </label>
      </div>
    </div>
  </div>
</div>

打字稿文件

  selectProduct(selected, item) {
    if (selected) {
      console.log(selected);
      this.request.title = item.product.title;
      this.request.product = item.product;
      this.request.currentQty = item.currentQty;
    }
  }

  changed(text: string) {
    if (!this.cRequestFirstWizard.invalid) {
      this.modelChanged.next(text);
    }
  }

我的表单中有一个单选按钮,我想选中并取消选中该按钮是否单击了两次,这意味着我想使单选按钮切换。

我必须在打字稿或html文件中进行哪些更改,以便功能可以正常工作。

0 个答案:

没有答案