Question

我有一个angularJs应用程序，需要支持三种语言，对于每种语言，我都需要使用不同的字体。我正在使用angular-translate更改语言，并且工作正常。当语言改变时，我也需要改变字体，所以我做了，我使用CSS变量，当语言改变时，我用字体名称更改了变量值。它工作正常，然后我知道CSS变量在IE中不起作用。然后，我决定使用另一种方法来执行此操作。我找到了this，我想如果我有这样的字体：

@font-face {
    font-family: 'Regular';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url('../fonts/roboto-regular-webfont.woff2') format('woff2'), url('../fonts/roboto-regular-webfont.woff') format('woff');
    font-display: block;
}

我将添加具有相同名称和不同src的新样式。但是有一个问题，就是每当我要更改语言时，都必须使用不同的src添加新样式。那么，有什么方法可以使用JavaScript在CSS中删除字体，还是可以更新或编辑src？或者任何人都可以告诉我另一种方法（更改语言时，字体也应更改）。

Answer 1

尝试在控制器中插入以下代码：

app.controller("bodyController", ($scope) => {
    $scope.lang_fonts = {};
    $scope.lang_fonts["en"] = "font-name";
    $scope.lang_fonts["sp"] = "font-name-2";
    $scope.current_lang = "en";
    document.getElementsByTagName("body")[0].style.fontFamily = $scope.lang_fonts[$scope.current_lang];
    //$("body").css("font-family", $scope.lang_fonts[$scope.current_lang]); // using jQuery
})

根据不同的语言更改字体？

1 个答案: