Question

我有一个内嵌javascript的剃刀视图，随着时间的推移变得凌乱，现在我将所有js（除了一些最小的初始化代码）移动到外部打字稿文件。将js代码重用为可能会很好，但它对于这个特定的视图非常具体。 js代码在很大程度上取决于许多html元素。我所拥有的是这样的：

module MyModule{

export class SomeClass{

    private $counter: any;
    private $answers: any;
    private $pager: any;
    private $anotherSelector1:any;
    private $anotherSelector2:any;
    private $anotherSelector3:any;
    private $anotherSelector4:any;
    private someId: number;

    constructor(public options: any) {

        this.init(options);

    }

    private init(options) {
        //setup objects, callbacks, other init code
    }
}
}

我从我的cshtml文件中调用它：

 $(document).ready(function () {

        var instance = new MyModule.SomeClass({
            $counter: $('#something'),
            $answers: $('#something'),
            $pager: $('#something'),
            //code omitted for brevity
            someId: "@Model.SomeId",

        });


    });

在我看来，尽管这种方法会产生更干净的剃刀视图，但是typescript文件仍然会与html DOM有很多依赖关系。我做得对吗？我是否应该考虑在视图中重构html？另外，我是否应该将cshtml文件中的init代码移动到ts文件中，还是应该保留它？在进行这样的重构时，我正在寻找最佳实践。

Answer 1

我不认为你做错了:)尽管我理解你的担忧。

我认为你想要解决的问题有点像一个更简洁的javascript，而不依赖于DOM选择器，你似乎真的想要knockoutjs或angularjs，这基本上是某种模板方法。查看有关如何完成的演示。

将razor视图内联javascript移动到外部打字稿文件

1 个答案: