2017-04-17 6 views
0

このコードを動作させようとしていますが、typescriptとknockout.jsに新たに追加されました。私はこのコードを別の方法で行っていましたが、既存のコードを改善するには、問題は、動作していない、おそらくタイプミスですが、私はそれを見つけることができません。TypescriptとKnockout.js

これは私の活字体である:

/// <reference path="../typings/index.d.ts" /> 

$(document).ready(function() { 
    ko.applyBindings(new ABMAlumnosModel()); 
}); 

class Alumno { 
    Legajo: KnockoutObservable<string>; 
    Nombre: KnockoutObservable<string>; 
    Apellido: KnockoutObservable<string>; 
    Dni: KnockoutObservable<number>; 
    Carrera: KnockoutObservable<string>; 
    Turno: KnockoutObservable<string>; 

    constructor(Legajo: string, Nombre: string, Apellido: string, Dni: number, Carrera: string, Turno: string) { 
     this.Nombre = ko.observable(Nombre); 
     this.Apellido = ko.observable(Apellido); 
     this.Legajo = ko.observable(Legajo); 
     this.Carrera = ko.observable(Carrera); 
     this.Turno = ko.observable(Turno); 
     this.Dni = ko.observable(Dni); 
    } 
} 


var ABMAlumnosModel = function() { 
    this.alumno = new Alumno('sdsdf', 'dsfdsf', 'sdfsdf', 0, 'dsfdsf', 'sdfsdfsd'); 
} 

そして、これは私のCSHTMLです:

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>ABM_Alumnos</title> 
    <script src="~/bower_components/jquery/dist/jquery.js"></script> 
    <script src="~/bower_components/knockout/dist/knockout.js"></script> 
    <script src="~/Scripts/ABM_Alumnos.js"></script> 
    <link href="~/Style/ABM_Alumnos.css" rel="stylesheet" /> 
</head> 
<body> 
    <div class="titulo"> 
     <bold><p>ABM Alumnos del Instituo ESBA</p></bold> 
    </div> 

    <div> 
     <form> 

      <div class="float-left c-input-wrapper"> 
       <p>Nombre: </p><input type="text" data-bind="text: alumno.Nombre"/> 
       <p>Legajo: </p><input type="text" data-bind="text: alumno.Legajo"/> 
       <p>Carrera: </p> <select id="alumno.Carreras"></select> 
      </div> 

      <div class="float-left t-input-wrapper"> 
       <p>Apellido: </p><input type="text" data-bind="text: alumno.Apellido"/> 
       <p>Dni: </p><input type="text" data-bind="text: alumno.Dni" /> 
       <p>Turno: </p> <select id="alumno.Turnos"></select> 
      </div> 

      <div class="clear"></div> 

      @*<div id="Agregar"> 
       <button data-bind="click: GetTurnos">Agregar</button> 
      </div>*@ 



     </form> 
    </div> 
</body> 
</html> 

私はモデル内の観測を行う代わりにコンストラクタを呼び出す覚えているが、私は同じであると感じています。つまり、入力テキストはオブジェクトをインスタンス化するときに入力したデータで埋められていませんAlumno

私はノックアウトチュートリアルとさまざまなタイスクリプトページにいくつかの情報を見つけようとしました。たぶん、私は間違ってデータをバインドします。

+0

downvoted人のために、私は質問を改善することができますので、理由を与えてくださいありがとう。 – Nickso

答えて

0

私は問題を見つけました。それはかなりシンプルでしたが、私のレーダーの下で正直に受け継がれました。問題は私のHTMLで、この入力に書き込む正しいプロパティはvalueで、textではなく、タグでデータをバインドしなければならない別のチュートリアルを行っていました。それはtextです。