私は BackBone JS を発見しています (ちなみに、これはかなり素晴らしいようです)。モデルの検証とコレクションのフィルタリングの両方でいくつかの問題が発生しています。
まず、ここに私のコードがあります:
$(document).ready(function() {
window.Movie = Backbone.Model.extend({
defaults: {
id: "?",
title: "Default movie title",
year: "Unknown",
seen: false
},
initialize: function Movie() {
this.bind("error", function(model, error) {
console.log("An error occured --> "+error);
});
},
_validate: function(attributes) {
console.log("Validation function called");
if(attributes.title == '') {
return "Title cannot be empty";
}
if(attributes.year > new Date().getFullYear()) {
return "Woops... looks like this movie is a time traveler"
}
if(typeof attributes.seen != 'boolean') {
return "Attribute 'seen' must be a boolean";
}
}
});
m1 = new Movie({year: 2012, title: 'My movie', id: 1});
m1.set({title: '', year: 2042});
});
このコードは、以前に jQuery、UnderscoreJS、および BackboneJS をロードする index.html ページからインクルードされています。
このコードは、空のタイトルを設定しようとすると、コンソールにエラーを表示するはずですが、_validate 関数が正しいattributes
パラメーターで呼び出されても表示されません。最初は、チュートリアルで読んだように (アンダースコアなしで) 関数に名前を付けましたvalidate
が、ムービーの作成または変更時にはまったく呼び出されませんでした。
別の方法として、今のところほとんど空の Movie オブジェクトのコレクションがあります。
window.Movies = Backbone.Collection.extend({
model: Movie,
initialize: function Movies() {}
});
m1 = new Movie({year: 1998, title: "Worldcup", id: 1});
m2 = new Movie({year: 1995, title: "1995 movie", id: 2});
m3 = new Movie({year: 2012, title: "2012", id: 3});
m4 = new Movie({year: 2008, title: "2008 movie", id: 4});
movies = new Movies();
movies.add([m1, m2, m3, m4]);
console.log("Displaying movies released after 2000 :");
var recent = movies.filter(function(movie) {
return movie.get('year') > 2000;
});
for(var i in recent) {
console.log(recent[i].get('title'));
}
フィルター関数は結果を返しません (2 つあるはずです)。だから私console.log(movie)
はこの関数でしようとしましたが、どうやらコールバックに渡された映画は常に未定義です。そこで、Google で検索したところ、さまざまな構文が見つかりました。その多くは、コレクション内にフィルター関数を作成することを含みます。
/* Returns a 'wrapped object' containing none of the movies it should */
getRecent: function(year) {
return _(this.filter(function(movie) {
return movie.get('year') > year;
}));
}
/* Does not work either : console.log on result gives http://bit.ly/ZvlkNi */
getRecent: function(year) {
var filtered = this.filter(function(movie) {
return movie.get('year') > year;
});
return new Movies(filtered);
}
/* Returns an empty array */
getRecent: function(year) {
return this.filter(function(movie) {
return movie.get('year') > year;
});
}
主に、同じことを行うにはさまざまな方法があり、私の場合はどれも機能しないように思われるため、私はちょっと迷っています。
ご助力ありがとうございます!クリストフ。