2017-01-25 4 views
1

Ich möchte ein Ereignis auf meinem Observable Array binden, so dass wenn die Eingabe (zB Beschreibung geändert hat wird es die Funktion auslösen.) Ich habe verschiedene Lösungen online, aber keine von gelesen sie scheinen Typoskript zu arbeiten mit Hier ist mein Code untenWie füge ich eine benutzerdefinierte Knockout-Funktion in Typescript hinzu

HTML:..

<tbody data-bind="foreach: income"> 
<tr> 
<td><input data-bind="value: description, event: {change: save} "/></td> 
<td><input data-bind="value: amount"/></td> 
</tr> 
</tbody> 

Typoskript:

ko.observableArray.fn['save'] = function() { 
    // does something 
} 
income = ko.observableArray([{ description: 'Description', amount: '0'}]); 
this.addIncome.save(); 

Es sagt mir, dass Eigentum 'saveExtendedBalance' existiert nicht auf dem Typ 'KnockoutObservableArray'. Wie schreibe ich das um?

Antwort

0

Ich habe gesehen, Sie haben ein Problem Ihr Knockout beobachtbaren Array deklarieren, wenn Sie Ihre Array zumindest mit einem Objekt initialisiert werden soll, müssen Sie diese Zeile:

income = ko.observableArray({ description: 'Description', amount: '0'});

dazu:

income = ko.observableArray([{ description: 'Description', amount: '0'}]);

Dies liegt daran, Sie zu initialisieren haben und immer diese Variable income wie ein Array zu behandeln ein Sie wie Objekt initialisiert wird.

+0

Leider habe ich die eckigen Klammern zu geben vergessen, als ich schrieb die Frage, aber sie sind in meinem Skript, so ist das Problem immer noch da. Ich habe die Frage bearbeitet, um den richtigen Code wiederzugeben. – franco

+0

Ihre Lösung könnte so etwas in Ihrem HTML-Code ' ' dann auf Ihrer VM hinzufügen diese Funktion 'this. save = function() { alert ("Hola") } '... Lassen Sie mich wissen, ob dies für Sie funktioniert. –

+0

$ root hat nicht für mich funktioniert, aber $ Eltern tat. Vielen Dank. – franco

0

ist die komplette und functionnal Beispiel dafür, was Sie wollen:

ich Ihnen auch eine Funktion gemacht Element von Ihnen Array zu entfernen.

Es ist der Typoskript Code:

class TestAdd { 
    dummyArray: KnockoutObservableArray<string> = ko.observableArray([]); 
    dummyToAdd: KnockoutObservable<string> = ko.observable(""); 

    save =():void => this.dummyArray.push(this.dummyToAdd()); 

    deleteElement = (elementToDelete: string):string[] => this.dummyArray.remove(elementToDelete); 
} 

ko.applyBindings(new TestAdd(), document.getElementById("Test")); 

Und der HTML-Code:

<section id="test"> 
    <input type="text" data-bind="value: dummyToAdd, event: {change: save}"> 
    <h3 data-bind="visible: dummyArray().length > 0">Your array:</h3> 
    <ul data-bind="foreach: dummyArray"> 
     <li><span data-bind="text: $data"></span> - <button data-bind="click: $parent.deleteElement">Delete element</button></li> 
    </ul> 
</section> 

In meinen Abhängigkeiten Ich verwende "@types/knockout": "^3.4.38"

Verwandte Themen