More Related Content
Similar to How do you like knockout? (20)
More from Narami Kiyokura (9)
How do you like knockout?
- 1. How do you like knockout?
合同勉強会in 大都会岡山-2014 Winter-
2014/12/13
OITEC
きよくらならみ
- 3. コミュニティ紹介
•Okayama IT Engineers Community
–OITEC
•.NET系・MS系のテクノロジが多い?
–特にしばりはないので、色々welcome
•http://oitec.vbstation.net/
- 12. 導入方法
•取り込み
–webからDL
•公式サイトorgithub
–bower
•bower install knockout
–NuGet
•Install-Package knockoutjs
•CDN
–https://cdnjs.com/
–http://www.asp.net/ajax/cdn
- 17. 例
varuser = { name: "きよくら", age: 20 };
このオブジェクトの値を…
こんなHTMLに設定したい…とする
- 35. “計算結果”をバインド
varUser = function () {
varself = this;
self.name = ko.observable("kiyokura");
self.age= ko.observable(20);
self.message= ko.computed(
function() {
returnself.name() + ", "+
self.age() + "さい";
});
};
varuser = new User();
<spandata-bind="text:message"></span>
- 53. 何の変哲もないwebフォーム
•「localStorageに一時保存させて」 と言われたたら?
<form action="register.php" method="post">
<p>
姓: <input type="text" name="lastName" />
名: <input type="text" name="firstName" /><br/>
tel: <input type="text" name="tel" /><br/>
e-mail: <input type="text" name="email" /><br/>
<hr/>
<input type="submit" value="登録" />
</p>
</form>
- 57. knockout とは
•OSS
–gihub
–MITライセンス
•依存関係もシンプル
–ほかのJSライブラリに依存しない
–サーバサイドのテクノロジにも依存しない
•(RubyでもPHPでも.NETでも)
- 61. おすすめ資料
•『Knockout.jsの概要』
–by MayukiSawatari
–https://speakerdeck.com/mayuki/knockout-dot-jsfalsegai-yao
•knockoutの二大機能の仕組みを丁寧にわか りやすく解説。おすすめ。
•動画もあります。
–https://www.youtube.com/watch?v=U- TRaV3IU6A