Question

以下是错误消息：

警告无效背景值为160：282。忽略。

警告，无效背景值为184：60084。忽略。

src / app / form / form.component.html（14,48）中的错误::属性＆＃39; name＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（27,69）:: Property＆＃39; homePhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（32,67）:: Property＆＃39; cellPhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（37,71）:: Property＆＃39; officePhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（168,21）:: Property＆＃39; homePhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（169,21）:: Property＆＃39; cellPhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（170,21）:: Property＆＃39; officePhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（189,11）:: Property＆＃39; NaN＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（14,48）:: Property＆＃39; name＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（27,69）:: Property＆＃39; homePhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（32,67）:: Property＆＃39; cellPhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在
src / app / form / form.component.html（37,71）:: Property＆＃39; officePhone＆＃39;类型＆＃39; FormComponent＆＃39;。
上不存在

这是我的 form.component.html

  <div [hidden]="submitted" >
    <form #calculatingForm="ngForm" (ngSubmit)="onSubmit(calculatingForm)" class="ui big form">

        <h2 class="ui dividing header">ProShine Quote Calculator</h2>
        <div class="spacer30"></div>


        <div class="ui grid">
          <div class="row">
            <div class="eight wide column">
              <div class="required field">
                <label for="name">Client Name</label>
                <input type="text" name="name" [(ngModel)]="name" #client="ngModel" required autofocus>

                <div [hidden]="client.valid || client.pristine" class="ui negative message">
                  <div class="header">
                    No Client Name Entered
                  </div>
                  <p>Please Enter A Name
                  </p>
                </div>
              </div>

              <div class="field">
                <label for="homePhone">Home Phone</label>
                  <input type="tel" name="homePhone" id="homePhone" [(ngModel)]="homePhone" placeholder="(123) 456-7890"
       [textMask]="{mask: mask}">
              </div>
              <div class="field">
                <label for="cellPhone">Cell Phone</label>
                <input type="tel" name="cellPhone" id="cellPhone" [(ngModel)]="cellPhone" placeholder="(123) 456-7890"
       [textMask]="{mask: mask}">
              </div>
              <div class="field">
                <label for="officePhone">Office Phone</label>
                <input type="tel" name="officePhone" id="officePhone" [(ngModel)]="officePhone" placeholder="(123) 456-7890"
       [textMask]="{mask: mask}">
              </div>
            </div>



            <div class="eight wide column">
              <div class="required field">
                <label for="totalPanes">Total Number of Panes</label>
                <input type="number" name="totalPanes" id="totalPanes" [(ngModel)]="totalPanes" #panes="ngModel" required>

                <div [hidden]="panes.valid || panes.pristine" class="ui negative message">
                  <div class="header">
                    You Didn't Enter A Number
                  </div>
                  <p>Please Enter the Number of Panes
                  </p>
                </div>
              </div>

              <div class="field">
                <label for="floorPanes">Number of Floor Panes</label>
                <input type="number" name="floorPanes" id="floorPanes" [(ngModel)]="floorPanes">
              </div>

              <div class="field">
                <label for="outsideLadderPanes">Number of Outside Ladder Panes</label>
                <input type="number" name="outsideLadderPanes" id="outsideLadderPanes" [(ngModel)]="outsideLadderPanes">
              </div>

              <div class="field">
                <label for="ladderPanesInAndOut">Number of Indoor AND Outdoor Ladder Panes</label>
                <input type="number" name="ladderPanesInAndOut" id="ladderPanesInAndOut" [(ngModel)]="ladderPanesInAndOut">
              </div>

            </div>
            </div> <!--End of row-->

            <div class="spacer30"></div>
            <div class="three column row">
              <div class="four wide column"></div>
              <div class="eight wide column">
                <div class="required field">
                  <label for="currentUser">Created By</label>
                  <select name="currentUser" id="currentUser" class="ui fluid dropdown " [(ngModel)]="currentUser" required>
                    <option value="">-- Select --</option>
                    <option value="Jason Walle">Jason Walle</option>
                    <option value="Aubree Walle">Aubree Walle</option>
                  </select>
                </div>
              </div>
            </div>

            <div class="row">
              <div class="column">
                <h2 class="ui dividing header">Additional Options</h2>
                <!-- <div class="spacer30"></div> -->
              </div>
            </div>
            <div class="row">
              <div class="eight wide column">
                <div class="field">
                  <label for="referral">Referral By</label>
                  <input type="text" name="referral" id="referral" [(ngModel)]="referral" >
                </div>

              </div>

              <div class="three wide column">

                  <div class="field">
                    <label for="clientDiscount">Discount</label>
                    <input type="text" name="clientDiscount" id="clientDiscount" [(ngModel)]="clientDiscount" >
                  </div>
              </div> 
            </div>
            <div class="row">
              <div class="eight wide column"></div>
              <div class="three wide column">
                <div class="field">
                    <label for="discountType">Discount Type</label>
                    <select name="discountType" id="discountType" class="ui fluid dropdown " [(ngModel)]="discountType" required>
                    <option value="">-- Select --</option>
                    <option value="Percentage">Percentage(%)</option>
                    <option value="Dollars">Dollars($)</option>
                  </select>
                  </div>
              </div>
            </div>


          </div>






      <div class="spacer50"></div>
      <button type="submit" class="ui blue button">Calculate</button>
      <button type="button" class="ui olive button" (click)="calculatingForm.reset()">New Client</button>
      <div class="spacer75"></div>
    </form>
  </div>


  <div [hidden]="!submitted" class="results-div">
    <button (click)="goBack()" class="ui blue button"> <i class="arrow alternate circle left outline icon"></i> Go Back</button>

    <!-- ============ PDF Generating Section ============= -->
    <div id="content"> 
      <div class="ui grid">
        <div class="three column row">
          <div class="column"></div>
          <div class="column">
            <img src="./../../assets/proshine-card.jpg" alt="" class="proshine-logo">
          </div>
          <div class="column"></div>
        </div>
      </div>

      <div class="spacer50"></div>
      <div class="ui grid">
        <div class="row">
          <div class="twelve wide column">
            <br>
            <h2 class="">Client Name: <span style="margin-left: 50px;font-size: larger">{{ clientName }}</span></h2>
            <div class="spacer30"></div>
          </div>
          <div class="eight wide column">
                <h3>Home Phone #: {{homePhone}} </h3>
                <h3>Cell Phone #: {{cellPhone}} </h3>
                <h3>Office Phone #: {{officePhone}} </h3>
          </div>
        </div>
      </div>
      <hr>

      <div class="spacer30"></div>

      <div class="ui grid">
        <div class="row">
          <div class="eight wide column">
            <h3># of Floor Panes: <h2>{{floorPanes}}</h2> </h3>
            <h3># of OUTSIDE Ladder Panes: <h2>{{outsideLadderPanes}}</h2> </h3>
            <h3># of Inside AND Outside Ladder Panes: <h2>{{ladderPanesInAndOut}}</h2> </h3>
          </div>
        </div>
      </div>
      <hr>
      <!-- <h3>Original Quote: ${{clientDiscount - }} </h3> -->
      <h3 *ngIf="clientDiscount!= NaN">Client Discount: <span style="color:firebrick">- ${{discountPrice}}  </span> </h3>
      <h1>Total Quote: <span class="quotePrice" >${{estimatedQuote}}</span> </h1>

      <div class="spacer50"></div>
      <h3>Created By {{currentUser}} on {{currentDate | date:'fullDate'}} </h3>
    </div>

  <div class="spacer50"></div>
  <button class="ui orange button" (click)="downloadPDF()">Export As PDF</button>
  <div class="spacer75"></div>

  </div>

这是我的 form.component.ts 文件

import { NavigationComponent } from './../navigation/navigation.component';
import { Estimate } from './../estimate';
import { NgForm, FormsModule } from "@angular/forms";
import { Component, OnInit } from '@angular/core';


@Component({
  selector: 'app-form',
  templateUrl: './form.component.html',
  styleUrls: ['./form.component.css']
})



export class FormComponent implements OnInit {


  constructor(
  ) { }

  // =========== Text Mask ==============
  mask: any[] = ['+','1',' ', '(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/]


// =========== Variables ===========
submitted = false;
// isOn = false;

costPerPane = 0.00;
costForLadder = 0.00;
costForFloorPanes = 0.00;
estimatedQuote = 0.00;
// quoteDemo = new Estimate("Phil",12,12,0,0,0);

clientName:string = "";
clientHomePhone:string;
clientCellPhone:string;
clientOfficePhone:string;
currentUser:string;
currentDate:string;
referral:string;


totalPanes:number;
floorPanes:number;
outsideLadderPanes:number;
ladderPanesInAndOut:number;
clientDiscount:number;
discountType:string;
discountPrice:any;





onSubmit(calculatingForm :NgForm){


  this.submitted = true;

  //Getting Form Input Values
  this.clientName = calculatingForm.form.get('name').value;
  this.clientHomePhone = calculatingForm.form.get('homePhone').value;
  this.clientCellPhone = calculatingForm.form.get('cellPhone').value;
  this.clientOfficePhone = calculatingForm.form.get('officePhone').value;


  this.totalPanes = calculatingForm.form.get('totalPanes').value;
  this.floorPanes = calculatingForm.form.get('floorPanes').value;
  this.outsideLadderPanes = calculatingForm.form.get('outsideLadderPanes').value;
  this.ladderPanesInAndOut = calculatingForm.form.get('ladderPanesInAndOut').value;

  this.clientDiscount = calculatingForm.form.get('clientDiscount').value;
  this.discountType = calculatingForm.form.get('discountType').value;

  this.currentUser = calculatingForm.form.get('currentUser').value;
  this.currentDate = Date.now().toString();



//  ============ TOTAL QUOTE ==========
  this.estimatedQuote = (this.costForFloorPanes + this.costForLadder);



  //------ Discount Amount ----------
  if (this.discountType == "Percentage") {
    this.clientDiscount /= 100;
    this.discountPrice = (this.estimatedQuote * this.clientDiscount);
    this.estimatedQuote -= (Math.round(this.discountPrice));
    this.discountPrice = (Math.round(this.discountPrice)).toString();
    // this.estimatedQuote = (Math.ceil(this.estimatedQuote));


  }else if(this.discountType == "Dollars"){
    this.discountPrice = this.clientDiscount.toString();
    this.estimatedQuote -= this.clientDiscount;


  }else{
    this.estimatedQuote = this.estimatedQuote;
  }



}//End of onSubmit

  public goBack(){
    this.estimatedQuote = 0.00;

    this.submitted = false;
  }
  public downloadPDF(){
    return xepOnline.Formatter.Format('content', {render: 'download'});
  }

  ngOnInit() {

  }



}

错误似乎在HTML中：

[(ngModel)]="stufffffffs"

Answer 1

您的ngModel绑定错误，variables中component form未加入clientName:string = "";clientHomePhone:string;clientCellPhone:string;

在你已经采取的组件中，

Name:string = "";HomePhone:string;CellPhone:string;

但你采取的形式，

client

您忘了添加<input type="text" name="name" [(ngModel)]="name" #client="ngModel" required autofocus>

例如

<input type="text" name="name" [(ngModel)]="clientName" #client="ngModel" required autofocus>

应该是，

replace

所以，/* * Encrypt *len bytes of data * All data going in & out is considered binary (unsigned char[]) */ unsigned char *aes_encrypt(EVP_CIPHER_CTX *e, unsigned char *plaintext, int *len) { /* max ciphertext len for a n bytes of plaintext is n + AES_BLOCK_SIZE -1 bytes */ int c_len = *len + AES_BLOCK_SIZE, f_len = 0; unsigned char *ciphertext = palloc(c_len); /* allows reusing of 'e' for multiple encryption cycles */ EVP_EncryptInit_ex(e, NULL, NULL, NULL, NULL); /* update ciphertext, c_len is filled with the length of ciphertext generated, *len is the size of plaintext in bytes */ EVP_EncryptUpdate(e, ciphertext, &c_len, plaintext, *len); /* update ciphertext with the final remaining bytes */ EVP_EncryptFinal_ex(e, ciphertext+c_len, &f_len); *len = c_len + f_len; return ciphertext; }所有出现的都是相同的。

Answer 2

使用组件中定义的ngModel相同的变量。它基本上意味着组件中有一个属性，它指的是。但由于组件中没有"homePhone"这样的变量，因此它给出了错误。

[（ngModel）] =“clientHomePhone”而不是[（ngModel）] =“homePhone”

<input type="tel" name="homePhone" id="homePhone" [(ngModel)]="clientHomePhone" placeholder="(123) 456-7890" [textMask]="{mask: mask}">

类似地，对于错误发生的所有其他输入。

阅读this了解ngModel的工作原理。

财产＆＃39;名称＆＃39;在类型＆＃39; FormComponent＆＃39;上不存在

2 个答案: