当详细信息为空时，不会显示空表单

debugcn 发表于 Dev

克尔普

在这里，我试图显示具有一些称为custominfo的详细信息的表单，这两种情况在这里很重要case-1：当自定义信息出现在具有详细信息的数据库显示表单中时。情况2：当数据库中没有自定义信息详细信息时，将以空格式显示。在这里，我收到了case-1，但没有收到case-2，该表格没有显示，我为此做了很多尝试，但是没有用，有人可以帮我解决这个问题。我的服务，

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';

import { IDetails } from './details';

@Injectable()
export class GetCustInfo {

    str = localStorage.getItem('social');
    loc = JSON.parse(this.str);
    id = this.loc.profile_id;
    private _productUrl = 'http://localhost/a2server/index.php/profile/editcustominfo/'+this.id;

    constructor(private _http: Http) { }

    getCustList(): Observable<IDetails[]> {
        return this._http.get(this._productUrl)
            .map((response: Response) => { return <IDetails[]> response.json().data[0]; 
            });

    }
}

我的main.ts（我要订购上述服务的地方），

     export class Custom {
     message:string = "Custom Info Updated";
   hide:any = false;
    http: Http;
   details:any;
    form: FormGroup;

     constructor(fbld: FormBuilder,http: Http,private    _service:GetCustInfo,public toastr: ToastsManager) {
    this.http = http; 
      this._service.getCustList()
        .subscribe(details => this.details = details,

                               err => this.details = {});

我的模板，

<div  class="col-sm-12 nopadding custominfo contenttoppadding">
    <form class="nobottommargin" *ngFor="details"  [formGroup]="form" (ngSubmit)="onSubmit(form.value)" name="template-contactform" action="include/sendemail.php" method="post" novalidate="novalidate">
        <div class="form-group">

            <div class="input-group divcenter">
                <span class="input-group-addon noradius inputgroupaddon"><i class="icon-facebook"></i></span>
                <input type="email" type="email" tooltip="Custom url" [tooltipDisabled]="false" [tooltipAnimation]="true"
                    tooltipPlacement="top" name="widget-subscribe-form-email" [formControl]="form.controls['custominfo']" [(ngModel)]="details.custominfo" class="form-control required email formcontrolheight" placeholder="Facebook" aria-required="true" />
            </div>
        </div>
    </form>
</div>

interface.ts，

 export interface IDetails{

           custominfo:string;
               }

在这里，即使值是空的，我也试图显示结果，但是当详细信息为空时，我将看不到表格。

slaesh

您想显示一种形式吗？或多种形式？您正在使用*ngFor？！而且您的变量details是一个数组，但是您的getCustList()函数仅返回第一个元素？

无论如何..将错误处理添加到您的getCustList() subscribtion：

this._service.getCustList()
            .subscribe(details => this.details = details,
                       err => {
                                 this.details = [{}]; /* put your empty/default model here */
                                 console.log(err);
                              }
                       );

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。