表单校验完善

src/app/pages/plan/plan.component.html

@@ -22,12 +22,21 @@
   <!-- 左侧建筑 -->
 
   <!-- 新增/编辑左侧建筑弹窗 -->
-  <nz-modal [(nzVisible)]="isShowBuildingPop" nzTitle="创建/编辑建筑" (nzOnCancel)="isShowBuildingPop = false" (nzOnOk)="addModelBuilding()">
+  <nz-modal [(nzVisible)]="isShowBuildingPop" nzTitle="创建/编辑建筑" (nzOnCancel)="isShowBuildingPop = false" (nzOnOk)="addModelBuilding(form.value)" [nzOkDisabled]='name.invalid'>
-    <form nz-form>
+    <form nz-form #form='ngForm'>
       <nz-form-item>
-        <nz-form-label [nzSpan]="5">名称</nz-form-label>
+        <nz-form-label [nzSpan]="6">名称</nz-form-label>
-        <nz-form-control [nzSpan]="12" nzErrorTip="请输入必填项">
+        <nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项">
-          <input nz-input ngModel name="name" required/>
+          <input nz-input #name='ngModel' ngModel name="name" required/>
+        </nz-form-control>
+      </nz-form-item>
+      <nz-form-item>
+        <nz-form-label [nzSpan]="6">请选择模型类型</nz-form-label>
+        <nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项" style="background-color: none;">
+          <nz-select #modelType='ngModel' ngModel name="modelType" required>
+            <nz-option nzValue="normal" nzLabel="建筑物"></nz-option>
+            <nz-option nzValue="environment" nzLabel="场景"></nz-option>
+          </nz-select>
         </nz-form-control>
       </nz-form-item>
     </form>

src/app/pages/plan/plan.component.ts

@@ -72,8 +72,8 @@ export class PlanComponent implements OnInit {
   buildingUIItems: any[] = []; //左侧 建筑list
   beforeOneBuildingID: string = null; //选中 左侧建筑ID
   isShowBuildingPop: boolean = false; //显隐 新增/编辑左侧建筑弹窗
-  isShowLeftBuilding: boolean = true; //显隐 建筑
+  isShowLeftBuilding: boolean = true; //显隐 建筑list
-  toggleLeftBuilding(e) { this.isShowLeftBuilding = e }; //显隐 建筑
+  toggleLeftBuilding(e) { this.isShowLeftBuilding = e }; //显隐 建筑list
 
   //选择建筑
   selectLeftBuilding(e) {
@@ -81,8 +81,8 @@ export class PlanComponent implements OnInit {
   }
 
   //创建建筑
-  addModelBuilding() {
+  addModelBuilding(form) {
-    console.log('add')
+    console.log(form)
   }
 
   //编辑建筑

src/app/service/babylon/building-basic-infos.service.ts

@@ -24,7 +24,7 @@ export class BuildingBasicInfosService {
    * 获取三维信息
    */
   getBuildingBasicInfos(name: string): Observable<string> {
-    return this.http.get<string>(this.baseUrl + '?name=' + name);
+    return this.http.get<string>(this.baseUrl + '/Get' + '?name=' + name);
   }
   /**
    * 保存三维信息
@@ -32,7 +32,7 @@ export class BuildingBasicInfosService {
    * @param data 
    */
   postBuildingBasicInfos(name: string, data: any): Observable<any> {
-    return this.http.post<any>(this.baseUrl + '?name=' + name, data)
+    return this.http.post<any>(this.baseUrl + '/PostOrPut' + '?name=' + name, data)
       .pipe(
         catchError((err) => this.handleError(err))
       );