Question

我正在尝试使用此代码来正式绑定选择类型选项：

      fieldGroup: [
    {
      key: 'TimeOffTypeID',
      type: 'select',
      className: 'flex-40 padding-10',
      templateOptions: {
        label: 'نوع مرخصی',
        placeholder: 'نوع مرخصی',
        required: true,
        options: this.getTimeoffType,
        valueProp: 'TimeOffTypeID',
        labelProp: 'TimeOffTypeName',
      },

和

    types$: BehaviorSubject<any[]> = new BehaviorSubject<any[]>([]);
     
    public get getTimeoffType(): Observable<any[]> {

    return this.types$.asObservable();
    }

和数据服务

      getTimeoffTypes() {

this.base
  .get(
    Controller.TIMEOFFTYPE,
    {
      TimeOffTypeID: 0,
    },
    Actions.SEARCH
  )
  .subscribe(({ result }) => {
    console.log(result)
    this.types$.next(result);
    
  })

}

结果包含我的数据，但此数据未绑定到表单选择选项

Answer 1

尝试这样的事情：

app.service.ts

import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';

@Injectable({ providedIn: 'root' })
export class TypeService {
    private types$ = new Subject<any>();

    sendTypes(type: any) {
        this.types$.next({ data: type });
    }

    clearTypes() {
        this.types$.next();
    }

    getTypes(): Observable<any[]> {
        return this.types$.asObservable();
    }
}

app.component.ts

import { Component, OnDestroy } from '@angular/core';
import { Subscription } from 'rxjs';

import { TypeService } from './_services/index';

@Component({ selector: 'app', templateUrl: 'app.component.html' })
export class AppComponent implements OnDestroy {
    types: any[] = [];
    subscription: Subscription;

    constructor(private typeService: TypeService) {
        // subscribe to home component messages
        this.subscription = this.typeService.getTypes().subscribe( type => {
          if (type) {
            this.types.push(type);
          } else {
            // clear messages when empty message received
            this.type = [];
          }
        });
    }

    ngOnDestroy() {
        // unsubscribe to ensure no memory leaks
        this.subscription.unsubscribe();
    }
}

Answer 2

我遇到了同样的问题，未显示选项。下面突出显示的代码有助于解决该问题； templateOptions：{ 标签：“性别”。 labelProp：“名称”， valueProp：“值”， 选项：[ { “名称”：“男”， “值”：“男” }， { “名称”：“女性”， “值”：“女性” }， { “名称”：“其他”， “值”：“其他” } ]，注意：我使用的是正式材料

绑定角度正式选择选项不起作用

2 个答案: