Knockout.js
Knockout.js
最終更新:2019/01/02
●Visual Studio 2015/2017 - TypeScriptの新しいバージョン(2.6から発生する)でknockout.jsがビルドエラーになる件
・2.5より新しいバージョンだとエラーが出る。2.5に変更したらビルドエラーでない
・エラーを無視する方法
・プロジェクトの「.csproj」に設定する方法
・エディタで開いて「True」を追加してビルドしたらエラー出ない
・プロジェクトの「.csproj」を編集しないでtsconfig.jsonを追加して設定する方法
・プロジェクトにtsconfig.jsonを追加して「"skipLibCheck": true // すべての型定義ファイル(*.d.ts)の型チェックをスキップする」を追加したらエラー出ない
typescript compiler bug? knockout.validation.d.ts doesn't compile anymore
●ドキュメントなど
公式サイト
日本語ドキュメント -非公式翻訳サイト-
Knock Me Out
Knockout.js Succinctly -無料e-book-
●Knockout.js - slideshare / speakerdeck -
20140712 knockoutjs-hands-on-in-osaka
Knockout handson
KnockoutJSを使用したアプリケーションの構築例
Knockout bindings
KnockoutJS勉強会 プロジェクトにmvvmを適用する狙い
Knockout.js を利用したインタラクティブ web アプリケーション開発
Knockout を用いた大規模 JavaScript 開発
TypeScriptでKnockoutを書いてみた
●概要
MVC(MVVM) JS フレームワークの中でKnockoutJsを選んだ理由
KnockoutJSの長所/短所とAngularJSとの比較
angular・backbone・knockoutの比較/印象まとめ
ASP.NET SignalRとknockout.jsで実現する次世代Webアプリ
[Knockout]MVVMパターンでアプリケーションを構築する
KNOCKOUT.JSの概要
knockout.jsでMVVMを実装 その1
MVVMフレームワーク「Knockout.js」が超絶便利!!その概要と使いどころなどについて
新・三大JavaScriptフレームワークの実践(Backbone.js Knockout.js Angular.js)
チュートリアルレベルをさらっと触ってみた感想
●入門
KnockoutJS Tutorial
knockout.jsのチュートリアルをやってみた
knockout.jsでさくさくWebアプリ開発
Knockout.jsを入門してみた
[Knockout.js基本編]最低限の構成で「Hello World」してみる
knockout.jsチュートリアル自分用メモ
knockout.js入門
●Knockout.js のベストな使い方【決定版】
Knockout.js のベストな使い方【決定版】
Knockout.js @GitHub
Knockout.jsのマイ運用方針
Knockout.js @GitHub - データバインド(ソース)
Knockout.js @GitHub - データバインド
Knockout.js @GitHub - フロー制御(ソース)
Knockout.js @GitHub - フロー制御
Knockout.js @GitHub - カスタムバインド(ソース)
Knockout.js @GitHub - カスタムバインド
●サンプル(CodePen)
Table detailed rows - Buefy example
Knockout lists
Form Validation UX in HTML, CSS and Knockout
table
Mini Customizer Knockout.js
KOJS tutorial2 for myself
KOJS tutorial1 for myself
Binding data in Knockout.js
Knockout1
Binding data in Knockout.js
Widget
Knockout1
●配列のアイテムを実際には削除せず、「削除済み」としてマークすることで論理削除(_destroy プロパティ)
クライアント側で削除したデータを、サーバーが知る一つの方法は、 真(true)の値を持った _destroy プロパティを
対象のインスタンスに加えることです。
サンプル
KnockoutJs Tutorial|ajaxでの送信と受信
Knockout.js チュートリアルのメモ:Loading and saving data
KnockoutJs 1.3 beta. _destroy:false has same result on ui as _destroy:true
Adding additional data to object in Knockout.js
Using knockout destroy() with django deserializer
●フォーマット
Knockout.js形式の日付項目
Knockout.js format date item
●サンプル
サンプル1
サンプル2(データの読み込みと保存)
サンプル3(テンプレート)
knockout.js data-bindで使われるバインディング(valueやtextなど)
knockout.js 表をソートしたい
knockout.js observableとobservableArray
knockout.js クリックされた行をinputタグに置き換える
knockout.js clickバインディングとaタグ
ASP.NET MVCとknockout.jsの連携:引数を渡してJSONを取得
ASP.NET MVCとknockout.jsの連携:データをJSONで渡す
ASP.NET MVCとknockout.jsの連携:データをJSONで渡す2
knockout.js SPAでURL指定でアクセスできるようにする
knockout.js クリックしたデータをレイアウトを変えて表示
knockout.js データの読込み、表示
knockout.js データのリスト表示
knockout.js データの件数で処理を変える
knockout.js 表示したデータを削除
knockout.js 表示したデータを編集可能にする
knockout.js ボタンクリックで表示のデータ追加
knockout.js データ群をforeachで出力
knockout.js ボタンクリックで大文字に変換
knockout.js inputに入力した文字を反映
knockout.js 入門・初心者向け情報を見る前の基本
キャレット位置をバインド&キャレット位置に文字列を挿入「caret binding」
Knockout.js勉強中! サンプルアプリ『電卓』
●aタグ
KnockoutJsのdata-bindとaタグについて
[knockout.js] KnockoutJSのHrefとmailtoリンク
●バリデーション
Native Validation Rulesは、Required、Min、MinLength、MaxLength、Email
Knockout-Validation
Observable を拡張する
いまさらながらKnockoutJSに入門してみた - フォームバリデーション
knockout.jsで入力チェック
Knockout Validation
Validation Form With Knockout.JS
Client Side Validation with Knockout.JS
Knockout.js Validations With and Without a Plugin
Knockoutjs Validation for areSame or mustMatch examples
[javascript] ko.validation.groupの使い方
Knockout JS validations
Validations in knockout js
Validate and Restrict Input through Custom Data Bindings in KnockoutJS
Knockout JS Validations, Without a Plugin and Using a Plugin
Using required Knockout js to validate a credit card form
knockout.js入門編「WordPressのフォームプラグインにリアルタイムバリデーションを実装する」
●select
Knockout.jsで動的なselectのデフォルト値を設定する
Knockout.jsでセレクトボックスを作る
●checked
【knockout.js】チェックボックスをビットフィールドにバインド【bitField-binding】
knockoutjs:Example 2: checked=checkedで表示・非表示:The checked binding
The "checked" binding
"checked" バインディング
Knockout.jsでチェックボックスを攻める
【Javascript】Knockout.jsでclickバインディングを使うとcheckedバインディングが機能しなくなる!!
「チェックされた」バインディング
Checked Binding Using Knockout in ASP.Net Application
how to bind true/false value to checkbox with ASP.NET MVC and Knockout JS
Creating Dynamic checkboxes with knockout.js
koGrid: Bug ? Checkboxes column duplication
Creating Dynamic checkboxes with knockout.js
Single-page Application with Knockout.js, Part 4
Binding Checkboxes with KnockoutJS
(Un)Check All using #KnockoutJS
Knockout.js “select all” checkboxes
Check All
Knockoutの小技集 〜チェックボックスの全選択ON/OFF〜
Knockout.js Check All
A simple group checkbox for Knockout.js
(Un)Check All using #KnockoutJS
Knockout.js check/uncheck all checkboxes using header checkbox
KnockoutJS - checked Binding
Select/Deselect All Checkboxes
A Smarter `checked` Binding for KnockoutJS
Magento2 : checkbox change function in knockout js
The Mistake Everyone Makes with KnockoutJS
[javascript] knockoutjsのチェックボックスのリストを使って作業する
Magento custom Knockout.js bindings
How to put multiple checkboxes into an observable array
knockout js button click select all the checkbox
knockoutjs:Example 1: checked=checkedにする:The checked binding
KnockoutJS Select Unselect all Checkbox list
knockout check/uncheck all combo box
●繰り返し
Knockout break foreach loop
How can I break or continue knockout's arrayforeach?
How to break this loop
Knockout.js pro tips – working with observable arrays
Knockout.jsのforeachで少しハマったのでメモ
●条件式
knockout.js ifバインディングでelseを使いたい
Knockout.js の if, ifnot, visible バインディングが View に反映されるまで要素を非表示にする
knockoutJSのifバインディングの罠
Knockoutを使ってみた - 条件式を使って表示内容を切り替える
【Knockout.js】ifバインディングを使ってみる
"if"バインディング
●注意
【Javascript】Knockout.jsでclickバインディングを使うとcheckedバインディングが機能しなくなる!!【初心者向け】
自分がプロジェクトでKnockoutを使うときに気をつけていること
●プラグイン
KnockoutJS の便利なプラグイン
knockout.mapping
knockoutとMappingプラグインとlocalStorageは相性がいいかも
Knockout.js の Mapping プラグインを使ったら凄く捗った件
knockout-validationでBootstrapのform-groupにhas-errorを付ける
ko.editables
knockout.observableDictionary
knockout-sortable
knockout-else
knockout-switch-case
ko-jQueryVisualState
Knockout ES5 でより自然な書き方へ
Knockout ES5 に対応したカスタムバインディングを書く作法
Knockout.Punches
Knockout-Kendo.js
ko.datepicker
bootstrap-slider-knockout-binding
●TypeScript
TypeScriptでKnockout!!
TypeScriptのクラスでKnockout.jsのViewModelを書くとき、foreach内でのclickバインディングでthisを参照できない問題とその解決方法いろいろ
TypeScriptでknockout.jsを使う・その1~準備~
TypeScriptでknockout.jsを使う・その2~基本的な使い方~
TypeScriptでknockout.jsを使う・その3~各種イベント発生時のバインディング~
TypeScriptでknockout.jsを使う・その4~コールバック関数内のthisの罠~
Visual Studio と TypeScript、Knockout.js、Linq.js を使って、MVVM してみよう!
Visual Studio + TypeScript + ASP.NET MVC5 + knockout でのソリューション構成のプラクティス
knockout.jsでバインディング・コンテキストの値をデバッガで確認する方法
knockout.jsを使ってプログレスバーを作ってみた
Knockout.jsで複数選択可能なテーブル
Knockout.jsで、要素を選択できるテーブル
●ページング
ページング機能付きの表
knockout.js を使ってページングを実装してみる
KnockoutJSを使って、カラムでソート実装する
knockout.jsを利用したMVVMによるコンポーネント作成。WebGridの基本的な使い方と、Pagerヘルパーの利用。
Create grid with knockoutjs
●使い方
Knockout.js 使い方メモ
knockout.js よく使うbindingのパターン
javascriptのknockout.jsのsimpleGridのヘッダーの非表示方法やセルの背景色の色、セルの境界線の非表示方法を教えてください。
Knockout.js で jQuery UI ‘sortable’を使う
KnockoutをTDDで学ぶ環境作り
knockout-validationでBootstrapのform-groupにhas-errorを付ける
Simple KnockoutJS Paging With Datatables
Grid With Paging Using KnockoutJS
Sorting Paging a Grid using Knockout JS and ASP.NET Web API Data Service
Data-grid using Knockout JS with paging and sorting
[Knockout.js] ko.editables で ViewModel をロールバック/コミットしてみる
KnockoutJS Advent Calendar 2014
[Knockout.js基本編]ko.observableメソッドでプロパティの変化をリアルタイムでDOMに反映させる
[Knockout.js基本編]Viewから参照できるのはViewModelオブジェクトとグローバルスコープのみ(っぽい)
KnockoutでサクっとWebサービスを作ろう
[javascript] knockoutjsで動作するように動的に挿入されたHTMLを取得する
[twitter-bootstrap] ブートストラップのツールチップがノックアウトバインディングで動作しないのですか? (wフィドル)
サンプルに惑わされるな!KnockoutでUIエフェクトを使う際のベター・プラクティス
KnockoutでシーケンシャルなjQueryアニメーション
Knockout.js 3.2の新機能Componentsを一足先に使う
●Visual Studio
TypeScripted Knockout in ASP.NET MVC
Knockout.js で足し算アプリ (Visual Studio2013)
Knockout.js でTodoアプリ (Visual Studio2013)
TypeScript+KnockoutJSアプリ (Visual Studio2013)
Knockout.js の依存の更新タイミングと rateLimit
Visual Studio 2013 の Single Page Application (SPA) テンプレートを使った開発 (Knockout.js)
Knockout.js で Multiple View (Partial View) をエレガントに切り替える方法
CRUD in ASP.NET MVC 4 with KnockOut.JS
Introduction to Knockout.js and CRUD Operations in ASP.Net Web Forms Using Knockout.JS
Jumpstart KnockoutJS with ASP.NET MVC/Web Api
Complete End to End CRUD Operations Using Knockout.JS and EntityFramework 5 in MVC4 Application
Developing, Architecting and Testing Web Applications with MVC 5, Web API 2, KnockoutJS, Ninject and NUnit
Knockout CRUD Operations using ASP.NET MVC
Web API CRUD Operations with Knockout
MVC CRUD Actions Using KnockoutJS
Getting Started with KnockoutJS in ASP.NET MVC
●調査中
ASP.net core install knockout issue
asp.net core 2.1 with knockout
DefinitelyTyped
Razor Pages, TypeScript and Knockout
TypeScript version of Knockout Web Mail Tutorial
●Advent Calendar
Knockout.js を TypeScript で書いてみる
初めてのTypeScript (3) - knockout.jsを利用してみる
KnockoutJSの長所/短所とAngularJSとの比較
KnockoutJSの紹介
selectExtensionsを使ってみる
Components を使ってみる
RICOH THETA 専用カスタムバインディングを作った話
ko.computedとko.pureComputed
Rails x CoffeeScript x KnockoutJSでWebサービス作った
ko.utils(配列編)
ko.utils(その他)
[Knockout.js] ko.editables で ViewModel をロールバック/コミットしてみる
ko.utils(その他)その2
KO + TypeScript で大規模 SPA 開発
Yeomanを使ってKnockoutのプロジェクトを作成する
KnowkoutJSでTrelloライクなWebアプリを作る
カスタムバインディングの作り方
Knockoutの template バインディング
Mappingプラグイン(その1)
キャレット位置をバインド&キャレット位置に文字列を挿入「caret binding」
Mappingプラグイン(その2)
KnockoutJS公式チュートリアルで学べる内容まとめ
Custom Component Loaders で外部のテンプレートファイルを読み込んでみる
KnockoutでHandlebarsを使ってみる
KnockoutHxを使って小規模SPA
自分がプロジェクトでKnockoutを使うときに気をつけていること
KO + TypeScript + Cordova でハイブリッドアプリ開発
knockoutの基礎知識
knockoutでのViewModelの書き方
knockoutでのList(配列)処理
knockoutのbinding
knockoutのcustom-binding
knockoutと既存UIライブラリの連携
knockoutのcomputed property
knockoutのscope(context)
knockoutのデバッグ方法
knockoutのsubscribe
[小ネタ] knockout.jsでラジオボタンのモデルの値に真偽値を使う
[小ネタ] knockout.jsのattrバインディングでreadonly属性を設定する
【knockout.js】knockout.jsのMappingプラグインで変更のあったデータを点滅させる方法
●しばやん雑記
Knockout.js の paging extender を使ってページングを実装する
Knockout.js 3.2.0 がリリースされたので新機能について一通り調べてみた
Knockout.js と ASP.NET MVC の組み合わせ時にモデルバインディングが腐る件
Knockout.js の if と visible は似ているようで違うので注意
Knockout.js の Mapping プラグインを使ったら凄く捗った件
knockout.js 2.3.0 と 3.0.0 ベータがリリースされていました
インテリセンスの新しい knockout.js サポート
knockout.js の最近の動向
knockout.js 2.1.0 がリリースされました
knockout.js でカスタムバインディングを作成する
knockout.js の注意すべき点
knockout.js でテンプレートを動的に切り替える
knockout.js 2.0.0 がリリースされたので試してみた
knockout.js の基本と 1.3.0 の新機能
ASP.NET MVC 4 で knockout.js を活用する
●Allied ArchitectsEngineer Blog
Knockout.js入門
Knockout.js入門 その2
KnockoutJSを使って、カラムでソート実装する
Knockout.jsでフォト蔵APIを使って写真一覧とボタンによるページ追加を作ってみる
●Knockoutの小技集
Knockoutの小技集 〜チェックボックスの全選択ON/OFF〜
Knockoutの小技集 〜左右二つのリストで移動可能なセレクトボックス(1)〜
Knockoutの小技集 〜左右二つのリストで移動可能なセレクトボックス(2)〜
CoffeeScriptとKnockout.jsのサンプル
●完敗だぜ!Knockoutでノックアウト
完敗だぜ!Knockoutでノックアウト – 導入編
完敗だぜ!knockoutでノックアウト – Todoアプリ編1
完敗だぜ!knockoutでノックアウト – Todoアプリ編2
完敗だぜ!knockoutでノックアウト – Todoアプリ編3
完敗だぜ!knockoutでノックアウト – Observable編
完敗だぜ!knockoutでノックアウト – Observable編2
完敗だぜ!knockoutでノックアウト – バインディング編
●.Net MVC4 で KnockoutJS
JSフレームワーク】 knockout.js を使った変更検知(ダーティ・チェック)を考える [1]
【JSフレームワーク】 knockout.js を使った変更検知(ダーティ・チェック)を考える [2]
.Net MVC4 で KnockoutJS ~【応用編1】BootstrapモーダルをKnockoutから呼び出す(カスタムバインディング)
.Net MVC4 で KnockoutJS ~【応用編3】WebAPIでセーブするための準備とか
.Net MVC4 で KnockoutJS ~【応用編4】Knockoutの多層オブジェクトをWebAPIで一気にセーブ
.Net MVC4 で KnockoutJS ~【応用編2】モーダルからビューモデルにデータを追加してみる
.Net MVC4 で KnockoutJS ~【基礎編4】成績表を作ってみよう Part2
.Net MVC4 で KnockoutJS ~【基礎編3】成績表を作ってみよう(Bootstrapでデザインも!)Part1
.Net MVC4 で KnockoutJS ~【基礎編2】 WebAPIで取得したデータをビューに表示(初めてのObservableArray)
.Net MVC4 で KnockoutJS ~ 【基礎編1】Knockoutのキホン、ViewModelとBinding
そろそろKnockoutJSばどげんかせんと。。。
●モーダル
knockout.jsでajaxでAPI叩いてモーダル表示分け
Bootstrap3のmodalをknockout.jsと連携させて表示する
Twitter Bootstrap Modals and Knockout.js
Twitter bootstrap 3 Modal with knockout
Knockout Bootstrap Modal Binding
bootstrapShowModal.js
Knockstrap
Knockout Bootstrap Modal Binding
Creating Custom Knockout Bindings
knockout.js/bootstrap binding to a bootstrap modal
Single-page Application with Knockout.js, Part 2
[twitter-bootstrap-3] Twitter bootstrap 3 Modal with knockout
●未整理
knockoutjsハンズオン勉強会 – 2014/05/17 – Microsoft 品川
まとめ:KnockoutJS
knockoutjs勉強会 – 2014/06/24 – Microsoft 品川
Copyright© 2005- Naoyuki Sano. All rights reserved.