使用Angular将Froala Editor设置为日语的方法

1 年 ago

雅, 悟

1 minute

不好意思，我将跳过Angular的安装步骤。

为了在Angular中创建所见即所得的编辑器，我们将使用一个名为angular-froala-wysiwyg的库来集成Froala Editor。

1. 安装npm

npm install angular-froala-wysiwyg

2.当安装完成后，请在配置文件中进行补充记录。

import { FroalaEditorModule, FroalaViewModule } from 'angular-froala-wysiwyg';

 imports: [
   ...
   FroalaEditorModule.forRoot(),
   FroalaViewModule.forRoot()
 ]

  "styles": [
    "styles.css",
    "../node_modules/froala-editor/css/froala_editor.pkgd.min.css",
    "../node_modules/froala-editor/css/froala_style.min.css",
    "../node_modules/font-awesome/css/font-awesome.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/froala-editor/js/froala_editor.pkgd.min.js",
    "../node_modules/froala-editor/js/languages/ja.js"
  ],

在JavaScript脚本中加载”ja.js”，这是将Froala Editor本地化为日语的文件。还提供其他语言版本。详细信息请参考此处链接。

在组件文件中添加代码以显示编辑器。

import { Component, OnInit } from '@angular/core';

@Component({
  ...,
  template: `<div [froalaEditor]="options"></div>`
})
export class AdminComponent implements OnInit {

  public options: Object = {
    language: 'ja',
  };

  constructor() { }

  ngOnInit () {
  }
}

使用options设置”language”为”ja”来完成。