2017-12-28 10 views
0

Ich habe eine Seite, die ich in dem Gebäude bin das Ziel ist für alle mehrere Fragen eine Summe eingegeben habenAngular Typoskript addiert Summe up Gruppen von Eingabetextfeld Zahlen

Beispiel

group1A = 3 
group1B = 5 
... etc.. 
group1Total = 8 (calculate on function call of each input or observable... 

HTML Angular

Code
<div class="col-xs-12" style="border:1px solid black; padding:10px"> 
    <div><strong>Group 1</strong></div> 
    <div class="form-inline"> 
    <label>1. Are you Prone to Infection, colds, coughs, or flu ?.............................. </label> 
    <input id="group1A" [(ngModel)]="group1A" name="group1A" style="width: 40px;" type="text" class="form-control" placeholder=""> 
    </div> 
    <div class="form-inline"> 
    <label for="group1B">2. Do you have inflammation, Heat spots ?................................................. </label> 
    <input id="group1B" [(ngModel)]="group1B" name="group1B" style="width: 40px;" type="text" class="form-control" placeholder=""> 
    </div> 
    <div class="form-inline"> 
    <label for="group1C">3. Do you have specific pain ? (printed, then list on Back)................... </label> 
    <input id="group1C" [(ngModel)]="group1C" name="group1C" style="width: 40px;" type="text" class="form-control" placeholder=""> 
    </div> 
    <div class="form-inline"> 
    <label for="group1D">4. Do you have swelling?..................................................................................... </label> 
    <input id="group1D" [(ngModel)]="group1D" name="group1D" style="width: 40px;" type="text" class="form-control" placeholder=""> 
    </div> 
    <div class="form-inline"> 
    <label for="group1E">5. Do you have pus, open sores, skin problems, mucus formation ?</label> 
    <input id="group1E" [(ngModel)]="group1E" name="group1E" style="width: 40px;" type="text" class="form-control" placeholder=""> 
    </div> 
    <div class="form-inline"> 
     <strong>Group 1 Total = {{group1A + group1B}}</strong>..................................................................................................... <input type="text" class="form-control" style="width: 50px;" id="group1" name="group1"> 
</div> 
</div> 

ich halte auf schlechte Beispiele von Typoskript zu sehen, dass statt Summe sie es als String behandelt, so anstelle von „8“ würde ich sehen „35“

Alle Javascript und Jquery Sachen, die ich nicht will, wie dies ist Angular5/Typescript.

ich eine Schleife über jede „Gruppe“ vorziehen würde, als ich 10 haben würde - 20 Gruppen, in denen jede Gruppe i

group1A Namen mit insgesamt Eingabe von group1Total dann sagen group2A group1E mit group2E Gesamt Eingabe von group2Total

diese Art von Code funktioniert nicht ...

<p>first number:<input type="number" [(ngModel)]='a'></p> 
<p>second number:<input type ="number" [(ngModel)]='b'></p> 
<h1>{{a + b}}</h1> 

export class AppComponent 
{ 
    a: number = 0; //set default value as 0 
    b: number = 0; 

} 
+0

Sie sagen, dass Ihr letztes Code-Snippet "nicht funktioniert". Was meinen Sie? Welches Ergebnis erhalten Sie mit diesem Code? – ConnorsFan

+0

Ich möchte Typoskript verwenden, um nach Eingabefeldänderungen zu sehen und die Werte in eine Gruppengesamtbox ​​zu setzen (summieren) –

+0

Und Sie bekommen das nicht mit dem letzten Codeausschnitt? Was ist das Problem mit diesem Code? – ConnorsFan

Antwort

0

Sie können Strings in Zahlen konvertieren leicht Vanille mit javaScript wie folgt aus:

{{Number(a) + Number(b)}} 
+0

Ich möchte alle Typescript verwenden und Schleifen haben, die nach dem Wert jeder Gruppeneingabegruppe1A + 4 andere suchen, um die Summe in einer group1total-Box anzuzeigen –