Question

你好我是角色的新手我在下拉列表中显示国家名称时遇到问题，在类型脚本中检索数据时下拉列表没有显示任何选项我认为我遇到了映射问题正确使用html的ts 这是我的ts代码

export class SignupComponent{
 registrationForm: FormGroup;
 username: AbstractControl;
 useremail: AbstractControl;
 countryCode: String  = "JOR" ;
 viewCountryCode: String = "JOR";
 languageCode: String;
 CountryId:number;      countries = CountryMapping.countryCode;
 submitAttempt: boolean = false;
 userResponse: UserResponse;
 apiResponseData: any;
 newCountries = [];
 urlCopied = true;
  countryList: any =[];

constructor(public builder: FormBuilder, public homeService: HomeService, 
  private router: Router,private _http: Http,
 private loaderService: LoaderService, private helperService: 
HelperService, private translate: TranslateService) {

this.languageCode = "EN"
this.CountryId=96;
this.homeService.getCountryByIp().subscribe(UserResponse => {
  this.userResponse = UserResponse;
  if (UserResponse.success) {
    var cc = UserResponse.data.countryCode;
      cc=cc.toLowerCase();
    this.viewCountryCode = cc;
  }
});
ngOnInit() {

this.signUpDone = false;
this.createSignupForm();
this.getCountryList();
this.getMerchantType();

 }

createSignupForm() {
this.registrationForm = this.builder.group({
  username: ['', Validators.compose([
    Validators.required,
    UserNameValidator.userNameRange,
    UserNameValidator.OnlyAlphabets
  ])],
  useremail: ['', Validators.compose([
    Validators.required,
    EmailValidator.mailFormat,
    EmailValidator.domainCheckFormat,
    EmailValidator.mailLength,
    EmailValidator.specialCharacters
  ])],
  countryCode:[this.viewCountryCode],
  commercialWebSiteLink: ['', Validators.compose([
    Validators.required,
     UrlValidator.urlFormat,
  ])],

  corporateWebSiteLink: ['', Validators.compose([
    Validators.required,
    UrlValidator.urlFormat,
  ])], 
  merchantType: ['PSP']

});
this.username = this.registrationForm.controls['username'];
this.useremail = this.registrationForm.controls['useremail'];
this.commercialWebSiteLink = this.registrationForm.controls['commercialWebSiteLink'];
this.corporateWebSiteLink = this.registrationForm.controls['corporateWebSiteLink'];
this.regestrationErrorMessage = " ";

  }
  getCountryList() {

this.homeService.getCountryList().subscribe(response => {

  if (response.success) {

   this.countryList = response.data;
    console.log("retrieved the country list");
  }

});
}


<div class="form-group ">
            <label class="control-label" for="countryCode">Country</label>
            <select class="form-control" id="countryCode" formControlName="countryCode">
                <option *ngFor="let country of countryList" [ngValue]="country" [attr.value]="country.countryCode"  [selected]="country.countryName == viewCountryCode">
                    {{country.countryName}}</option>
            </select>
        </div>

我真的很感谢明天需要的任何帮助，所以请帮助我

Answer 1

有趣的是，它似乎在后端（Spring）没有国家/地区列表查询错误的是检索没有数据因此在下拉列表中没有生成国家/地区，被检索到，上面的代码没有问题就像魅力。

在选择标记中显示一个不在角度2中工作的对象

1 个答案: