javascript - 如何在asp.net mvc视图上调用打字稿方法
问题描述
我在我的 mvc 5 应用程序中集成了 typescript 并创建了一个 typescript 文件来加载我的 json 数据。我收到“未定义导出”的错误(我不知道如何解决这个问题)。
另外我想知道如何在页面加载时将数据加载到我的Index.cshtml视图中。
如何创建用于插入数据的 post 方法?
谁能告诉我如何实现这一目标?
我试过的
应用程序.ts
/// <reference path="Scripts/typings/jquery/jquery.d.ts" />
import * as $ from "jquery";
export class Employee {
Id: number;
EmpName: string;
Age: number;
Gender: string;
Address: string;
Contact: string;
Email: string;
CountryId: number;
IsActive: boolean;
}
export class EmployeeRepository {
private employees: Array<Employee> = [];
constructor() {
this.loadEmployees();
}
loadEmployees=(): void=> {
$.getJSON('Employee/Index',
data => {
this.employees = data;
if(data.count()>0) {
this.displayUsers();
}
});
};
protected displayUsers(): void {
let table = '<table class="table">';
for (let i = 0; i < this.employees.length; i++) {
table += '<tr>' +
'<td>' + this.employees[i].Id + '</td>' +
'<td>' + this.employees[i].EmpName + '</td>' +
'<td>' + this.employees[i].Age + '</td>' +
'<td>' + this.employees[i].Gender + '</td>' +
'<td>' + this.employees[i].Address + '</td>' +
'<td>' + this.employees[i].Contact + '</td>' +
'<td>' + this.employees[i].Email + '</td>' +
'</tr>';
}
table += '</table>';
$('#content').html(table);
}
}
function GetEmployees() {
const empData = new EmployeeRepository();
document.getElementById("content")
.innerHTML = this.empData;
}
tsConfig.json
{
"compileOnSave": true,
"compilerOptions": {
"noImplicitAny": false,
"noEmitOnError": true,
"removeComments": false,
"sourceMap": true,
"target": "es5",
"module": "commonjs",
"outDir": "../appScriptsJS"
},
"exclude": [
"node_modules",
"wwwroot"
]
}
员工控制器
public class EmployeeController : Controller
{
private IEmployeeRepository _employeeRepository;
private ICountryRepository _countryRepository;
public EmployeeController(IEmployeeRepository employeeRepository,
ICountryRepository countryRepository)
{
_employeeRepository = employeeRepository;
_countryRepository = countryRepository;
}
[HttpGet]
public ActionResult Index()
{
try
{
var employeeList = _employeeRepository.GetAllEmployeesAsync();
return View(employeeList);
}
catch (Exception e)
{
Console.WriteLine(e);
throw;
}
}
}
我正在使用 vs 2017 和 typescript 3.1 。
任何帮助我都会非常感激。
解决方案
推荐阅读
- flutter - LateInitializationError:字段“currentLatLng”尚未在 Flutter 中初始化
- image - 想要在颤动中使用文件选择器或图像选择器时获取图像或视频的实际路径?
- kubernetes - 如何使用 yq 在条件下修补 k8s yaml 文件的数组数据?
- javascript - Filepond 自动触发表单提交时本地文件的还原操作
- memory - 为什么访问非自然对齐的内存效率不高?
- python - numba 对 numpy.linalg.inv 有效吗?
- shell - 如何在 unix shell 脚本中包含带有 uuencode 的列标题
- java - 如何使用一个事务对所有数据库调用进行集成测试并在之后回滚?
- python - 如何将一行添加到 groupby 组中,并在每个新插入的行中更改一个值?
- php - PHP网站从本地主机更改域名不起作用