页面

app/app-locales.component.css

 .example-full-width {
     width: 100%;
 }
+md-select {
+    margin: 16px 0;
+}
\ No newline at end of file

app/app-locales.component.html

-<!--<h3 md-subheader>语言</h3>-->
-
 <md-tab-group *ngIf="app">
     <md-tab *ngFor="let locale of locales" [label]="locale">
         <form class="example-form" style="margin-top:16px;">
@@ -23,4 +21,10 @@
             <button md-raised-button color="primary">提交</button>
         </form>
     </md-tab>
+
+    <md-tab #translate label="添加翻译">
+        <md-select placeholder="语言" [(ngModel)]="locale" name="locale" class="example-full-width">
+            <md-option *ngFor="let l of untranslated_locales()" [value]="l">{{l}}</md-option>
+        </md-select>
+    </md-tab>
 </md-tab-group>
\ No newline at end of file

app/app-locales.component.ts

-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, ViewChild} from '@angular/core';
 import App, {I18n} from '../models/browserapp';
 import {AppService} from './app.service';
 import {ActivatedRoute, Params} from '@angular/router';
 import 'rxjs/Rx';
-import {MdIconRegistry} from '@angular/material';
+import {MdIconRegistry, MdTab} from '@angular/material';
 import {DomSanitizer} from '@angular/platform-browser';
 
 @Component({
@@ -15,6 +15,8 @@ export class AppLocalesComponent implements OnInit {
     app: App;
     locales: string[];
     news: I18n<string> = {};
+    @ViewChild('translate')
+    translate: MdTab;
 
     constructor(private appService: AppService, private route: ActivatedRoute, iconRegistry: MdIconRegistry, sanitizer: DomSanitizer) {
     }
@@ -30,4 +32,8 @@ export class AppLocalesComponent implements OnInit {
                 }
             });
     }
+
+    untranslated_locales() {
+        return ['zh-CN', 'zh-TW', 'en-US', 'ja-JP'].filter(locale => !this.locales.includes(locale));
+    }
 }

app/app.component.css

 .wrapper {
     min-height: 1000px;
-    padding-left: 20px;
-    padding-top: 20px;
+    padding: 20px 20px 0 20px;
 }
 
 md-sidenav {

app/apps.component.ts

@@ -38,4 +38,8 @@ export class AppsComponent implements OnInit {
             this.snackBar.open(error.toString());
         }
     }
+
+    test(event: any) {
+        console.log(event);
+    }
 }