2012-03-02 14 views
18

czy istnieje sposób mogę wywołać funkcję JavaScript w danych-wiążą tak:Knockout.js - funkcja na danych javascript-wiążą

<span id="lblSomePropVal" data-bind="text: MySomeFunction(SomeProperty())" ></span> 

co próbuję zrobić, to zadzwonić MySomeFunction z wartością SomeProperty mojego modelu widoku. Moja funkcja Niektóre zwróci tekst na podstawie przekazanej wartości, która będzie wyświetlana w obszarze lblSomePropVal.

Próbowałem go tak, jak napisałem w przykładzie, ale zgłasza błąd wiązania.

Czy coś tu brakuje, czy jest jakiś inny sposób na zrobienie tego?

Jest to błąd otrzymuję:

Microsoft JScript runtime error: Unable to parse bindings. 
Message: [object Error]; 
Bindings value: text: MySomeFunction(SomeProperty()) 
+0

Wypróbuj 'data-wiążą = "text: MySomeFunction.bind (SomeProperty())"' – sll

+0

próbował. nie działa. – Asdfg

Odpowiedz

12

można użyć dowolnego ś JavaScript Powiązania dla powiązań, ale należy pamiętać, że są one oceniane w kontekście viewmodel, więc wszystkie funkcje w wyrażeniu muszą być właściwościami viewmodel. W twoim przypadku, MySomeFunction musi być własnością twojego viewmodelu. Jeśli utworzyć ViewModel przy użyciu wtyczki mapowania, można dołączyć dodatkowe funkcje do viewmodel tak:

var viewModel = ko.mapping.fromJS(data.d) 
viewModel.MySomeFunction = function(...){...}; 
+0

Przepraszam, że przeszkadzam, ale wciąż otrzymuję komunikat "MySomeFunction" jest niezdefiniowany? –

+0

Również uzyskuję "nieokreślony" przy użyciu tej metody. – svante

+0

musiałem to w pełni zakwalifikować, w przeciwnym razie nie można tego zobaczyć ... zakładając, że jest w bibliotece lub module – Clarence

5

No ja właśnie przeżywa samouczka siebie, ale myślałem, że trzeba było założyć własność i używać ko.computed celu nadania jej wartości (od samouczek):

function AppViewModel() { 
this.firstName = ko.observable("Bert"); 
this.lastName = ko.observable("Bertington"); 
this.fullName = ko.computed(function(){ 
    return this.firstName() + " " + this.lastName(); 
    },this); 
} 

Wtedy można mieć:

Full name: <strong data-bind="text: fullName"></strong> 
+1

Wiem, że można to zrobić, ale zastanawiałem się, czy mogę wywołać funkcję JS w atrybut wiążący w ten sposób nie muszę pisać wiele kodu JS do manipulowania każdą właściwością – Asdfg

+0

Peter jest tutaj. Możesz po prostu zbudować swoją funkcję wewnątrz swojego viewmodelu i to zadziała. Na przykład, jeśli MySomeFunction był w AppViewModel powyżej, możesz nazwać to po prostu w porządku. Dodatkowo możesz użyć podstawowych rzeczy javascript takich jak '.toUpperCase()' wewnątrz danych-bind – deltree

+0

Myślę, że to nie działa, ponieważ moja funkcja jest poza viewmodel. Używam knockout mapper do deklarowania mój viewmodel (var viewModel = ko.mapping.fromJS (data.d);). Jak mogę dołączyć funkcję do mojego viewmodel poniżej? – Asdfg

12

miałem podobny problem próbuje obliczyć wpisy komórka tabeli. Co pracował dla mnie był tym „MySomeFunction” w moim modelu danych, a następnie wiązania danych moje komórki tabeli jako:

<td data-bind="text: $root.MySomeFunction(SomeProperty)"></td> 
+3

. Jeśli nadal masz problemy, wypróbuj '', aby upewnić się, że $ root ma właściwości, których się spodziewasz. –

1

udało mi się zrobić to za pomocą kontekstu. Jeśli potrzebujesz całego kodu, mogę go ci wysłać.

<h2 class="text" data-bind="html: currentProgram($context)"></h2> 

function currentProgram(context){ 
    var title = '<font size="1">' + context.$data.name + '</font>'; 
    return title; 
} 

Potrzebny będzie również ustawić to

 $.ajaxSetup({ 
      async: false 
     }); 
0
<div style="font-size:18px;float:left;width:95%" data-bind="html: trimString(AccountName,25)"></div> 

function trimString(value, maxLen) { 

    //Return undefined, and short strings 
    if (value === undefined) return undefined; 
    if (value.length < maxLen) return value; 

    return value.substring(0, (maxLen - 1));  
} 
Powiązane problemy