Typescript和Knockout.js [英] Typescript and Knockout.js
问题描述
我正在尝试使此代码正常工作，我是Typescript和tickout.js的新手，我一直在用另一种方式来编写这段代码，但是有人告诉我这可能是改进现有代码的更好的方法，问题是，不起作用，可能是拼写错误，但我找不到.
Im trying to get this code working, Im new to typescript and knockout.js I have been doing this piece of code in another way but someone told me this could be a better way to improve the existing code, the problem is, is not working, maybe is a typo but Im not finding it.
这是我的打字稿:
/// <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:
And this is my 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时，输入的文本没有填充我放置的数据.
I remember doing the observables inside model instead of calling a constructor, but I feel is the same. The thing is, the input texts are not being filled with the data I put when I instance an object Alumno.
我试图在淘汰赛教程和不同的打字稿页面中找到一些信息.可能是因为我错误地绑定了数据.
I tried to find some info into the knockout tutorial and different typescript pages. Maybe im binding the data incorrectly.
推荐答案
好，我发现了这个问题，它很简单，但是老实说是在我的雷达范围内通过的.问题出在我的html中，要在此输入上编写的正确属性是value而不是text，我在做另一个教程，其中我必须将数据绑定到<p>标记上，这就是text.
Ok I have found the problem, it was pretty simple, but honestly passed under my radar. The problem was in my html, the correct property to write on this input was value and not text, I was doing another tutorial where I had to bind data on a <p> tag, and that is text.
这篇关于Typescript和Knockout.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
