How to transform knockout js model to amber class?
Locked
 
|
Hi, all.
-- I'm studying knockout examples and tried to transform "ClickCounter" project to Amber . I can use TagBrush object to inject the data-bind attribute and revoked "ko applyBindings: ClickCounterViewModel new " to relink the original js model which was built by js function constructor way. But I found it is not possible to use Amber class to replace the js function object easily even by using inline javascript codes. So, I think is there ways to transform the js function object like the one below to Amber? and How? var ClickCounterViewModel = function() {
this.numberOfClicks = ko.observable(0);
this.registerClick = function() {
this.numberOfClicks(this.numberOfClicks() + 1);
};
this.resetClicks = function() {
this.numberOfClicks(0);
};
this.hasClickedTooManyTimes = ko.computed(function() {
return this.numberOfClicks() >= 3;
}, this);
};You received this message because you are subscribed to the Google Groups "amber-lang" group. To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email]. For more options, visit https://groups.google.com/groups/opt_out. |
|
I have created a wrapper - see the code below.
You can call from JavaScript the prepare function after amber loaded: smalltalk.Knockout._prepare(); Next you create a model and bind it to Knockout: initKnockout: rowdata | model | model := #{}. model at: 'usr_id' put: (Knockout observable: (rowdata at:'usr_id')). model at: 'usr_memberid' put: (Knockout observable: (rowdata at:'usr_memberid')). Knockout applyBindings: model. Hope it helps. Cheers, laci PS You can also check out the thread "using knockout from amber" - http://forum.world.st/using-knockout-js-from-amber-tt4664105.html#a4665993 Smalltalk current createPackage: 'Knockout'! Object subclass: #Knockout instanceVariableNames: '' package: 'Knockout'! Knockout class instanceVariableNames: 'knockout'! !Knockout class methodsFor: 'private'! ko " console log: Knockout ko " <var o = {}; for(var prop in ko) { if(ko.hasOwnProperty(prop)) { o[prop] = ko[prop] } }; return o;> ! ! !Knockout class methodsFor: 'public'! doesNotUnderstand: aMessage "self inspect. aMessage inspect. Transcript show: aMessage; cr." ^aMessage sendTo: knockout ! prepare " console log: Knockout prepare " knockout := self ko. ! ! |
|
|
Thanks.
-- is the rawdata to SomeClass#initKnockout: an instance variable of the type of Dictionary in the SomeClass ? can the blocks that are maps to js functions ( eg. the registerClick, resetClick function in the example model) be put to the model ? best, tgkuo laci於 2013年8月20日星期二UTC+8下午7時04分07秒寫道： I have created a wrapper - see the code below. You received this message because you are subscribed to the Google Groups "amber-lang" group. To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email]. For more options, visit https://groups.google.com/groups/opt_out. |
|
|
rawdata is a JSON array or HashedCollection like that:
{ "usr_id":"9","usr_memberid":"1000056165",... } You can pass a BlockClosure like that: "customerModel at: 'computed' put: (Knockout computed: [self abc])." customerModel at: 'computed' put: (Knockout computed: [console log: 'computed called']). abc console log: 'abc called'. ^'hello' Guess that will do. Let us know. |
|
|
If I wrote an class method on amber model as below according to the js model, ClickCounterStModel>>initKnockout | model | model := #{}. model at: 'numberOfClicks' put: ( ko observable: 0) . model at: 'registerClick' put: [ numberOfClicks value: ( numberOfClicks value + 1 ) ]. model at: 'resetClicks' put: [ numberOfClicks value: 0 ]. model at: 'hasClickedTooManyTimes' put: ( ko computed: [ ( numberOfClicks value ) >= 3 ]). Knockout applyBindings: model. Obviously, the data, numberOfClicks cann't be resolved inside the blockclosures. Your way of using the model seemed be ok with simple raw data, but not suited for functions. Best, Tsun laci於 2013年8月20日星期二UTC+8下午11時42分06秒寫道： rawdata is a JSON array or HashedCollection like that: You received this message because you are subscribed to the Google Groups "amber-lang" group. To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email]. For more options, visit https://groups.google.com/groups/opt_out. |
|
|
Without any investigation maybe because the function has to return a value. My other example calling a method might work for you. From: Eno [via Smalltalk] Sent: 20/08/2013 18:02 To: laci Subject: Re: How to transform knockout js model to amber class? If I wrote an class method on amber model as below according to the js model, ClickCounterStModel>>initKnockout | model | model := #{}. model at: 'numberOfClicks' put: ( ko observable: 0) . model at: 'registerClick' put: [ numberOfClicks value: ( numberOfClicks value + 1 ) ]. model at: 'resetClicks' put: [ numberOfClicks value: 0 ]. model at: 'hasClickedTooManyTimes' put: ( ko computed: [ ( numberOfClicks value ) >= 3 ]). Knockout applyBindings: model. Obviously, the data, numberOfClicks cann't be resolved inside the blockclosures. Your way of using the model seemed be ok with simple raw data, but not suited for functions. Best, Tsun laci於 2013年8月20日星期二UTC+8下�11時42分06秒寫�： rawdata is a JSON array or HashedCollection like that: You received this message because you are subscribed to the Google Groups "amber-lang" group. To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email]. For more options, visit https://groups.google.com/groups/opt_out. If you reply to this email, your message will be added to the discussion below:
http://forum.world.st/How-to-transform-knockout-js-model-to-amber-class-tp4704264p4704344.html
To start a new topic under Amber Smalltalk, email [hidden email]
To unsubscribe from Amber Smalltalk, click here. NAML |
«
Return to Amber Smalltalk
|
1 view|%1 views
| Free forum by Nabble | Edit this page |