使用打字稿创建 HTML 使用模板

Question

尝试打字稿，我想实现以下目标：

使用 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));

这不会用 question.QuestionNumber... 或文本替换 ${QuestionNumber}。我不想使用字符串追加，我想使用干净的 html，最好在单独的 .html 文件中使用。

基本上我在问：是否可以使用打字稿，如果可以，如何使用？如果不是，使用 angularjs 实现此目的的最佳实践方法是什么？（但仍在使用打字稿）

Answer 1

正确的语法是：

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

这里重要的部分是`(backquote/backtick)
的用法 用 ` 而不是 " 和 ' 包裹你的字符串 以使用 ${} 语法。

这是一个 TypeScript（和 ES6）特性。

使用打字稿创建 HTML 使用模板

Using typescript to create HTML using template

javascript

dynamic-html

angularjs

typescript