私はKnockoutJS
に新しく、私はUIにデータを取得するムービーAPIに基づいた学校プロジェクトにこれを使用しています。KnockoutJS - データバインディングエラー
これは、すべてのjavascriptのコードは私のapp.jsです:
var ViewModel = function() {
var self = this;
self.movies = ko.observableArray;
self.error = ko.observable;
var moviesUri = '/api/movies/';
function ajaxHelper(uri, method, data) {
self.error('');
return $.ajax({
type: method,
url: uri,
dataType: 'json',
contentType: 'application/json',
data: data ? JSON.stringify(data) : null
}).fail(function(jqXHR, textStatus, errorThrown) {
self.error(errorThrown);
});
}
function getAllMovies() {
ajaxHelper(moviesUri, 'GET').done(function(data) {
self.movies(data);
});
}
getAllMovies();
};
ko.applyBindings(new ViewModel());
そして、これは、データが表示されている私のindex.htmlです:私は、コードをチェックし
@section scripts {
@Scripts.Render("~/bundles/app")
}
<div class="page-header">
<h1>Movie Database API</h1>
</div>
<div class="row">
<div class="col-md-4">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">Movies</h2>
</div>
<div class="panel-body">
<ul class="list-unstyled" data-bind="foreach: movies">
<li>
<!--<strong>
<span data-bind="text: DirectorName"></span>
</strong>:--> <span data-bind="text: Title"></span>
<small>
<a href="#">Details</a>
</small>
</li>
</ul>
</div>
</div>
<div class="alert alert-danger" data-bind="visible: error">
<p data-bind="text: error"></p>
</div>
</div>
<div class="col-md-4">
<!-- TODO: Movie details -->
</div>
<div class="col-md-4">
<!-- TODO: Add new movie -->
</div>
</div>
それはうまくいくようですが、私がアプリケーションを実行するとき、私はこれをコンソールに入れます:
Uncaught ReferenceError: Unable to process binding "foreach: function (){return movies }" Message: Unable to process binding "text: function (){return Title }" Message: Title is not defined
誰かが正しい方向に向かい、何が間違っているのか教えてもらえますか?おかげさまで