Использование глобальных переменных C # в Typescript

Question

При написании кода Javascript в файле Razor / cshtml можно написать код следующим образом:

if (lSelectedID == "@(Globals.MyGlobalVariable)") {
...
}

где Globals.MyGlobalVariable является переменной C #. Если Globals.MyGlobalVariable == 123, то результирующий Javascript на клиенте будет

if (lSelectedID == "123") {
...
}

Вышеуказанное очень удобно. Но как сделать то же самое в Typescript? То есть Как вставить глобальную переменную C # (или результат вызова функции C # или чего-либо еще) в машинописный текст до преобразования файла машинописного текста в Javascript?

Answer 1

Я думаю, что проще всего было бы скопировать ваши глобальные переменные в Typescript на стороне клиента. Вот как я сделал это для моих последних двух проектов.

Итак, на стороне сервера у вас будет:

// C#

public class Globals()
{
    public int GlobalNum {get;} = 0;
    public string GlobalString {get;} = "123";
}

А на стороне клиента в Typescript это будет:

// Typescript 

export enum Globals{
    GlobalNum = 0;
    GlobalString = "123";
}

Теперь вы можете забыть о сложности попыток подключить Razor (который отображает на стороне сервера) к вашему Typescript (который выполняется на стороне клиента), при этом оставаясь ясным и очевидным набором глобальных ссылок, на которые можно ссылаться.

Ваш код может стать:

// Typescript

if (lSelectedID == Globals.GlobalString) {
   //...
}

Единственное, что вам нужно помнить, это то, что ваши глобальные переменные существуют в двух местах - один раз на стороне сервера и один раз на стороне клиента.

Typescript требует, чтобы вы все равно реплицировали много своих серверных классов на стороне клиента, для правильного получения, например, данных ответа на выборку, поэтому добавление Globals class / enum не должно быть слишком большим нарушать норму.

Answer 2

Не рекомендуется включать JavaScript и CSS непосредственно в ваш CSTHML.Скорее вы должны иметь их в своем собственном файле и ссылаться на них в своем представлении.

Если вашему JavaScript понадобится какое-то значение из C #, то вам следует сохранить его, используя атрибут данных в ваших элементах HTML.

Пример:

<span id="myGlobalVariable" data-value="123456">MyGlobalVariable</span>

Затем в вашем TypeScript получите данные, которые вы установили в вашем View

let myGlobalVariable = document.getElementById("myGlobalVariable").dataset.value;
if (lSelectedID == myGlobalVariable) {

}