发表于   |   分类于 ， ，   |     |   阅读次数

摘要：本文将介绍在 Angular4 项目中配置 ngx-translate i18n 国际化组件

npm 安装 ngx-translate 模块

1
2
npm install @ngx-translate/core --save
npm install @ngx-translate/http-loader --save

在 Angular 项目配置

app.module.ts

添加

1
2
3
4
5
6
7
8
9
10
11
12
import { TranslateLoader, TranslateModule} from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';

  imports: [
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (createTranslateHttpLoader),
        deps: [Http]
      }
    })
  ]

结果如下： 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpModule, Http } from '@angular/http';
import { TranslateLoader, TranslateModule} from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';

import { AppComponent } from './app.component';

export function createTranslateHttpLoader(http: Http) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpModule,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (createTranslateHttpLoader),
        deps: [Http]
      }
    })
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts

添加

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import { TranslateService } from "@ngx-translate/core";

  constructor(public translateService: TranslateService) {

  }
  
  ngOnInit() {
    // --- set i18n begin ---
    this.translateService.addLangs(["zh", "en"]);
    this.translateService.setDefaultLang("zh");
    const browserLang = this.translateService.getBrowserLang();
    this.translateService.use(browserLang.match(/zh|en/) ? browserLang : 'zh');
    // --- set i18n end ---
  }

结果如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
import { Component } from '@angular/core';
import { TranslateService } from "@ngx-translate/core";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';

  constructor(public translateService: TranslateService) {

  }

  ngOnInit() {
    // --- set i18n begin ---
    this.translateService.addLangs(["zh", "en"]);
    this.translateService.setDefaultLang("zh");
    const browserLang = this.translateService.getBrowserLang();
    this.translateService.use(browserLang.match(/zh|en/) ? browserLang : 'zh');
    // --- set i18n end ---
  }
}

添加多语言文件

在 src/app/assets/ 下创建 i18n 文件夹，并在文件夹内创建 en.json 和 zh.json 文件
angular-i18n-folder

测试

app.component.html

添加代码：

1
2
3
4
<div>
  <span> test the i18n module: ngx-translate</span>
  <h1>{{ 'hello' | translate }}</h1>
</div>

在 en.json 和 zh.json 文件中添加配置

en.json 

1
2
3
{
  "hello": "the word is hello"
}

zh.json 

1
2
3
{
  "hello": "你好"
}

测试结果

在中文下
angular-i18n-result-zh

在英文下
angular-i18n-result-en

示例代码

angular + ngx-translate

参考文章

ngx-translate core

发表于   |   分类于 ，   |     |   阅读次数

摘要：本文讲述在 Ubuntu 16.04 中安装 MySQL

执行命令

1
sudo apt install mysql-server mysql-client

会弹出框让你输入 root 用户密码，等待安装完成。。。

发表于   |   分类于   |     |   阅读次数

摘要：本文讲述 Ubuntu 16.04 在刚安装好的时候，下载一些 .deb 软件后，通过 Ubuntu Softwrare Center 无法安装的解决方案。

问题

当刚安装好 Ubuntu 16.04 后，发现要安装 chrome 和 搜狗拼音都安装不了，下载的是 .deb 文件，出现图片中的问题。
Waiting to install

解决方案

1
sudo apt-get install gdebi

接着在右击你要安装的 .deb 文件，选择 Open With —> GDebi Package Installer这时会有如下窗口，点击 Install Package
这里写图片描述

有如下结果代表安装成功！！！
这里写图片描述

参考文章：

16.04 Cannot install anything from Ubuntu Software center [duplicate]

发表于   |   分类于   |     |   阅读次数

摘要：本文讲述在 Ubuntu 16.04 中如何设置菜单栏在桌面的下边或者左边。

设置在下边

1
gsettings set com.canonical.Unity.Launcher launcher-position Bottom

效果如图：
下边

设置在左边

1
gsettings set com.canonical.Unity.Launcher launcher-position Left

左边

目前不支持上边和右边。。。。

发表于   |   分类于   |     |   阅读次数

摘要：本文讲述如何在 Ubuntu 16.04 中编译安装为知笔记。

安装依赖的软件

git

1
sudo apt-get install git

编译工具

1
sudo apt-get install build-essential

CMake

1
sudo apt-get install cmake

zlib

1
sudo apt-get install zlib1g-dev

Qt

安装 5.7.0 for Linux 64-bit (715 MB) 或者更高版本
Qt5.7.0
下载下来的安装文件，更改权限为可执行，然后执行安装程序。不要用管理员权限安装，直接安装到home目录即可，例如~/Software/Qt5.7.0

安装 Wiz

下载 Wiz 源代码

1
2
3
4
5
6
cd ~
mkdir WizTeam
cd WizTeam
git clone https://github.com/WizTeam/WizQTClient.git
cd WizQTClient
git checkout v2.5.1

在 Qt 打开 Wiz

在 Qt5.7.0/Tools/QtCreator/bin/ 目录下运行 qtcreator 程序，并通过 Qt 打开 WizQTClient 目录下的 CMakeLists.txt 文件

右键点击项目 选择 Run CMake
右键点击项目 选择 Run

问题

如果遇到下面的问题

1
Failed to find "GL/gl.h" in "/usr/include/libdrm".

处理方法：
执行下面命令

1
sudo apt-get install libgl1-mesa-dev libglu1-mesa-dev

一切顺利的话，为知笔记就运行起来啦。。。。。。

找 WizNote

那么为知笔记编译后的文件在哪呢？
我们可以找到 WizTeam 这个文件夹里面多了个 build-WizQTClient-Desktop_Qt_5_7_0_GCC_64bit-Debug 文件夹，进入文件夹里面找到 src/WizNote，没错。。。就是这个了，双击就可以打开为知笔记了。
找 WizNote

参考文章：
编译为知笔记客户端
Linux编译安装为知笔记
Ubuntu 16.04编译WizNote填坑小记