使用typescript使用模板创建HTML

Ziv*_*man 5 javascript dynamic-html angularjs typescript

尝试打字稿,我想实现以下目标:

从服务器获取问题文本和数字,并使用typescript在某个地方的DOM中显示它.

目前我有以下.ts文件:

class QuestionResponse {
    constructor(public questionText, public questionNumber) {
    }
}
function questioner(question: QuestionResponse) {

    return '<div data-val-id="${QuestionNumber}"> ${QuestionText} </div>';
}

var testQuestion = new QuestionResponse("Question text number 5", 5);

//this will be replaced by .innerHTML of some element:
alert(questioner(testQuestion));
Run Code Online (Sandbox Code Playgroud)

这不会将$ {QuestionNumber}替换为question.QuestionNumber ...也不会替换Text.我不想使用字符串附加,我想使用干净的html,最好是在单独的.html文件中.

基本上我在问:是否有可能使用打字稿,如果是的话,怎么样?如果没有,使用angularjs实现这一目标的最佳实践方法是什么?(但仍使用打字稿)

Alo*_*mir 9

正确的语法是:

function questioner(question: QuestionResponse) {
    return `<div data-val-id="${question.questionNumber}"> ${question.questionText} </div>`;
}
Run Code Online (Sandbox Code Playgroud)

这里的重要部分是`(反引用/反引号)
的使用用`而不是'包裹你的字符串和'以利用${}语法.

这是TypeScript(和ES6)功能.