javascript - 从 Html 将数据/元素名称传递给 TypeScript 类

Question

我试图围绕将元素名称或其他数据（例如数据库 id）从我的 Html（ASP.NET Core Razor 应用程序）传递给 TypeScript 类的正确方法展开思考。

假设我在 TypeScript 中有以下类：

class Manager {
    _map: kendo.dataviz.ui.Map;
    _id: number;

    constructor(map, id) {
        this._map = map;
        this._id = id;
    }

    DoSomething() {

    }
}

而且我不想在 TypeScript 中硬编码 map 元素的选择器，或者在加载页面之前不知道 Id 的值。如何将此数据传递给我的 TypeScript 类？

我假设（错误地）在我的 Html 中我可以做类似的事情

<script>
    let manager = new Manager($("myMap"), 1);
    manager.DoSomething();
</script>

但这会导致未定义的错误（我认为这很有意义，因为 TypeScript 类是孤立的/在 window 属性中不存在）。

那么将这些数据传递给 TypeScript 类的正确方法是什么？我知道我可能只是将一些选择器硬编码到我的 TypeScript 类中并从 DOM 中读取值，但我担心必须将这些值硬编码到 TypeScript 类中，而不是能够从我所在的实际页面中提供它们正在渲染此内容。如果我将值硬编码到 TypeScript 类中，并且如果我更改元素名称，我现在需要在 Razor 和 TypeScript 类中更改它们。这种方法也意味着我需要隐藏字段来将数据库 ID 传递给我的 TypeScript 类。

这种情况的正确/最佳实践是什么？是简单地对两个地方的值进行硬编码并进行 DOM 选择，还是有某种方法可以动态地将这些值传递给类构造函数？

标签： javascripthtmltypescriptdom