我是新来的有角度的人,正在做一个表格。我将一个字段设置为带有值的只读字段,但是在发布表单时,我希望该只读值也提交到数据库中。 我正在使用Cloud Firestore作为数据库。因此,我将为您提供帮助。
我做了一些修改,但对我没有用,所以我现在需要做些什么。
这里,我的表格是
<form (ngSubmit)="addWorkshop()" #workshopForm="ngForm" role="form" class="padding-left">
<label>
<h3>Add Workshop</h3>
</label>
<div class="form-group row">
<div class="col-lg-8 col-md-6 col-sm-12">
<label>Commercial Name</label>
<input type="name" class="form-control" id="cname" name="commercialName"
#commercialName="ngModel" [(ngModel)]="model.commercialName" required>
</div>
</div>
<div class="form-group row">
<div class="col-lg-8">
<label for="address">Address</label>
<input type="text" class="form-control" id="address" name="address" #address="ngModel" [(ngModel)]="model.address"
required>
</div>
</div>
<div class="form-group row">
<div class="col-lg-4">
<label>Telephone 1</label>
<div class="row">
<!-- <div class="col-3">
<input type="text" class="form-control" id="telephone" formControlName="telephone"name="telephone">
</div> -->
<div class="col-9">
<input type="tel" id="telephone1" class="form-control" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}"
[(ngModel)]="model.telephone1" name="telephone1" #telephone1="ngModel" required />
</div>
</div>
</div>
<div class="col-lg-4">
<label for="telephone2">Telephone 2</label>
<div class="row">
<!-- <div class="col-3">
<input type="text" class="form-control" id="phone" formControlName="phone" name="phone">
</div> -->
<div class="col-9">
<input type="tel" id="telephone2" class="form-control" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}"
[(ngModel)]="model.telephone2" name="telephone2" #telephone2="ngModel" required />
</div>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-lg-6">
<label for="tradeLicense">Trade License</label>
<input type="text" class="form-control" id="tradeLicense" [(ngModel)]="model.tradeLicense" name="tradeLicense" #tradeLicense="ngModel"
required>
</div>
</div>
<div class="form-group row">
<div class="col-lg-6">
<label for="areaServed">Area Served</label>
<!-- <select class="form-control dropdown-select" multiple="multiple" id="areaServed" [(ngModel)]="model.ZoneIds" name="ZoneIds" #ZoneIds="ngModel"
required>
<option></option>
<option>1</option>
<option>2</option>
<option>3</option>
</select> -->
<select class="form-control dropdown-select" multiple searchable="Search here.."id="areaServed" [(ngModel)]="model.ZoneIds" name="ZoneIds" #ZoneIds="ngModel"required>
<option value="" disabled selected></option>
<option value="1">USA</option>
<option value="2">Germany</option>
<option value="3">France</option>
<option value="4">Poland</option>
<option value="5">Japan</option>
<button class="btn-save btn btn-primary btn-sm">Save</button>
</select>
</div>
</div>
<div class="form-group row">
<div class="col-lg-8">
<label for="workshopID">Workshop ID<small> (Automatically Generated by system)</small></label>
<input type="hidden" name="workshopID" value="ws-100">
<input type="text" class="form-control workshop-id" id="workshopID" readonly
value="Ws-100" placeholder="ws-100">
</div>
</div>
<button type="submit" class="btn btn-default button-color pull-right">Add Workshop</button>
</form>
我添加的功能是:
add(model) {
debugger
let data =
{
ZoneIds:model.ZoneIds,
address: model.address,
commercialName: model.commercialName,
telephone1: model.telephone1,
telephone2: model.telephone2,
tradeLicense: model.tradeLicense,
//workshopID: model.workshopID,
}
// for(var i=0; i< model.ZoneIds.length; i++)
// {
// data.ZoneIds.push(model.ZoneIds[i]);
// }
return new Promise((resolve, reject) => {
resolve(
this.workshopsCollection.add(data).then(x=>{
debugger
let res = x;
})
);
});
}