1

プロジェクトでノックアウト js を使用しようとしているので、単純な Hello World の例を試しましたが、うまくいきませんでした。私は新しいMVC4プロジェクトを作成し、以下の単純なバインディングをコピーするだけで私のコードです

<script src="~/Scripts/knockout-2.1.0.js" type="text/javascript"></script>
<script type="text/javascript">

    // Here's my data model
    var viewModel = function (first, last) {
        this.firstName = ko.observable(first);
        this.lastName = ko.observable(last);

        //this.fullName = ko.computed(function () {
            // Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName, because these get called when evaluating fullName.
            //return this.firstName() + " " + this.lastName();
        //}, this);
    };

    $(document).ready(function() {
        ko.applyBindings(new viewModel("Planet", "Earth")); // This makes Knockout get to work
    });​
</script>

<div class="liveExample">   
    <p>First name: <input data-bind="value: firstName" /></p> 
    <p>Last name: <input data-bind="value: lastName" /></p> 
    @*<h2>Hello, <span data-bind='text: fullName'> </span>!</h2>*@  
</div>

基本的に、モデルの値をテキストボックスに表示するだけです。プロジェクトで既にノックアウト js を参照しましたが、機能しません。また、ノックアウト js を BundleConfig.cs に追加しました。

bundles.Add(new ScriptBundle("~/bundles/knockout").Include("~/Scripts/knockout-2.1.0.js"));

私は働きませんでした

4

2 に答える 2

4

MVC を使用している場合は、スクリプト セクションを使用して JS を宣言します。これにより、宣言が HTML ページの下部に移動され、HTML が最初にレンダリングされます。箱から出して初めて機能したコードの私のバージョンは次のとおりです。

@{
    ViewBag.Title = "Index";
}


<h2>Index</h2>

<div class="liveExample">
    <p>First name:
        <input data-bind="value: firstName" /></p>
    <p>Last name:
        <input data-bind="value: lastName" /></p>
    @*<h2>Hello, <span data-bind='text: fullName'> </span>!</h2>*@
</div>

@section scripts {
    <script src="~/Scripts/knockout-2.2.1.js"></script>
    <script type="text/javascript">
    var viewModel = function (firstName, lastName) {
        this.firstName = ko.observable(firstName);
        this.lastName = ko.observable(lastName);
    };

    $(function () {
        ko.applyBindings(new viewModel("Planet", "Earth"));
    });
    </script>
}
于 2013-01-16T11:54:23.403 に答える
0

ドキュメントのにノックアウトを入れてみてください。エラーメッセージが表示されない場合、私が言えるのは、同様の問題が発生したことだけです。それが私にとっての修正でした。

私の例は、MVCではなくフィドルで機能したため、私を夢中にさせました。私のデザイナーの友人にそれを伝えました。彼は、基本的に、ページのレンダリングを開始する前にノックアウトを完全にダウンロードする必要があると言いました。

お役に立てれば

于 2013-01-16T02:30:00.040 に答える