-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathindex.html
232 lines (215 loc) · 11.2 KB
/
index.html
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
<!doctype html>
<!--[if lt IE 7]> <html class1="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="Description" content="angular translate brings internationalization (i18n) and localization (l10n) to your Angular apps!">
<meta name="fragment" content="!">
<title>angular translate - i18n for your Angular apps, made easy.</title>
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/animations.css">
<link rel="stylesheet" href="css/docs.css">
<link rel="stylesheet" href="css/font-awesome.css">
<link rel="stylesheet" href="css/styles.css">
<script src="js/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-translate/2.6.1/angular-translate.js"></script>
<script src="js/docs-setup.js"></script>
<script src="js/docs.js"></script>
<script>
var app = angular.module('at', ['pascalprecht.translate']);
app.config(function ($translateProvider) {
$translateProvider.translations('en', {
TITLE: 'Hello',
FOO: 'This is a paragraph.',
BUTTON_LANG_EN: 'english',
BUTTON_LANG_DE: 'german'
});
$translateProvider.translations('de', {
TITLE: 'Hallo',
FOO: 'Dies ist ein Paragraph.',
BUTTON_LANG_EN: 'englisch',
BUTTON_LANG_DE: 'deutsch'
});
$translateProvider.preferredLanguage('en');
});
app.controller('Ctrl', function ($scope, $translate) {
$scope.changeLanguage = function (key) {
$translate.use(key);
};
});
</script>
</head>
<body ng-app="at">
<header class="header">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<ul class="nav">
<li>
<a href="https://angular-translate.github.io/docs"><i class="icon-book"></i> Getting Started</a>
</li>
<li>
<a href="https://angular-translate.github.io/docs/#/api"><i class="icon-book"></i> API</a>
</li>
</ul>
<ul class="nav pull-right">
<li>
<a href="https://angular-translate.github.io/docs/plato"><i class="icon-signal"></i> Plato Report</a>
</li>
<li>
<a href="https://github.com/angular-translate/angular-translate"><i class="icon-github-sign"></i> View on GitHub</a>
</li>
</ul>
</div>
</div>
</div>
</header>
<div role="main" class="masthead">
<div class="container">
<img src="img/logo/angular-translate-alternative/angular-translate_alternative_medium2.png">
<p class="tagline">i18n for your Angular apps, made easy</p>
<p>
<a href="https://github.com/angular-translate/bower-angular-translate/releases" class="btn btn-primary btn-large"><i class="icon-download"></i> Download</a>
<a href="https://github.com/angular-translate/angular-translate" class="btn btn-primary btn-large"><i class="icon-github-sign"></i> View on GitHub</a>
</p>
</div>
</div>
<div class="divider"></div>
<div class="main container">
<div class="shutdown">
<div style="border-left: 4px solid red; padding-left: 10px; margin: 10px;">
<p style="color: red; font-weight: bolder;" dir="auto">Caution</p>
<p dir="auto">This <strong>project has been discontinued</strong> since 2024-01-15 and this project is now archived. As the <a href="https://blog.angular.io/discontinued-long-term-support-for-angularjs-cc066b82e65a" rel="nofollow">AngularJS ecosystem itself has stopped long-term support since January 2022</a>, you may already be using Angular 2+ and some of the other cool translation tools. Although it is highly recommended that you to migrate away from AJS v1, if you are still actively using AngularJS and cannot migrate yet, you may want to look at <a href="https://www.herodevs.com/support/services" rel="nofollow">HeroDevs who offer extended support</a>. We are not familiar with them.</p>
<p dir="auto">More information on this decision are archived in the <a href="https://github.com/angular-translate/angular-translate/issues/1921">issue #1921</a>.</p>
<p dir="auto">The project resources will remain read-only for everyone. Feel free to fork.</p>
</div>
</div>
<div class="intro">
<div class="row">
<div class="span4">
<h2>What?</h2>
<p>angular-translate is an <a href="https://angularjs.org">AngularJS</a> module that makes your life much easier when it comes to <strong>i18n</strong> and <strong>l10n</strong> including lazy loading and pluralization.</p>
</div>
<div class="span4">
<h2>Features</h2>
<p>It provides components like filters and directives, asynchronous loading of i18n data, full pluralization support through <a href="#">MessageFormat</a> and much more!</p>
</div>
<div class="span4">
<h2>Flexibility</h2>
<p>angular-translate is very flexible. You can build <strong>your own</strong> loaders, storages or error handlers and extend angular-translate to your needs!</p>
</div>
</div>
</div>
<hr>
<div class="example">
<div class="row">
<h1 class="span12">How it works</h1>
<div class="span8">
<pre class="prettyprint linenums">
var app = angular.module('at', ['pascalprecht.translate']);
app.config(function ($translateProvider) {
$translateProvider.translations('en', {
TITLE: 'Hello',
FOO: 'This is a paragraph.',
BUTTON_LANG_EN: 'english',
BUTTON_LANG_DE: 'german'
});
$translateProvider.translations('de', {
TITLE: 'Hallo',
FOO: 'Dies ist ein Paragraph.',
BUTTON_LANG_EN: 'englisch',
BUTTON_LANG_DE: 'deutsch'
});
$translateProvider.preferredLanguage('en');
});
app.controller('Ctrl', function ($scope, $translate) {
$scope.changeLanguage = function (key) {
$translate.use(key);
};
});</pre>
</div>
<div class="span4">
<div class="well">
<h2 translate="TITLE">Hello</h2>
<p translate="FOO">This is a paragraph</p>
</div>
<div ng-controller="Ctrl">
<button class="btn" ng-click="changeLanguage('en')" translate="BUTTON_LANG_EN" class="ng-scope">english</button>
<button class="btn" ng-click="changeLanguage('de')" translate="BUTTON_LANG_DE" class="ng-scope">german</button>
</div>
</div>
</div>
</div>
<hr>
<div class="peeps">
<div class="row">
<h1 class="span12">What people say</h1>
<blockquote class="span6">
<p>When building a product with global reach, angular-translate is a must-have addition to AngularJS. It integrates seamlessly with your application, making internationalization as easy as maintaining a few files containing all translations. angular-translate works very nicely with all AngularJS dynamic data-binding features, making it a breeze to switch languages on-the-fly. Highly recommended! </p>
<footer>
<span>- <strong>Sander Mak</strong>, Luminis Technologies</span>
</footer>
</blockquote>
<blockquote class="span6">
<p>I looked for some localization stuff to bring translations from server to client. There were some modules for i18n, but they didn't match all my needs. Then I found an angular-translate and I loved this module! Seriously. I was really surprised by its quality and support. It's also really awesome that the author of angular-translate is always open for new ideas!</p>
<footer>
<span>- <strong>Max Prichinenko</strong>, Freelancer</span>
</footer>
</blockquote>
</div>
<div class="row">
<blockquote class="span6">
<p>I needed i18n and l10n support on a new project that integrated well with AngularJS, angular-translate fits the bill perfectly. Plenty of features, well thought out interfaces and the documentation is clear and easy to follow. IMO this is the best framework I've seen written with AngularJS</p>
<footer>
<span>- <strong>Chris Jones</strong>, Waters Corporation</span>
</footer>
</blockquote>
</div>
</div>
<hr>
<div class="companies">
<div class="row">
<h1 class="span12">Who uses it?</h1>
<ul class="span12">
<li>
<a href="http://neoskop.de">
<img src="img/builtwith/neoskop.svg">
</a>
</li>
<li>
<a href="http://luminis-technologies.com">
<img src="img/builtwith/luminis.gif">
</a>
</li>
<li>
<a href="https://jhipster.github.io">
<img src="img/builtwith/jhipster.png">
</a>
</li>
<li>
<a href="https://taskzone.com">
<img src="img/builtwith/taskzone.svg" height="40%" width="40%">
</a>
</li>
<li>
<a href="http://www.theonegenerator.com/">
<img src="img/builtwith/theonegenerator.png">
</a>
</li>
</ul>
</div>
</div>
</div>
<footer class="footer">
<div class="container">
<p>Brought to you by <br><a href="https://github.com/PascalPrecht"> <img width="40" height="40" src="https://secure.gravatar.com/avatar/b32bdb1fc9fdadeb45d7a1267fdd2fc4?s=40"> Pascal Precht</a> <a href="https://github.com/knalli"><img height="210" src="https://secure.gravatar.com/avatar/6c349ffd9793132e1d217f0de572e080?s=40" width="40" height="40"> Jan Philipp</a> <a href="https://github.com/DWand"><img height="40" width="40" src="https://secure.gravatar.com/avatar/2146036b95ee605ca39779b958cd54ce?s=40"> Max Prichinenko</a>
<a href="https://github.com/DanielaValero"><img height="40" width="40" src="https://secure.gravatar.com/avatar/88c25c37e0293da177f803a97ebe660b?s=40"> Daniela Valero</a> <a href="https://github.com/firehist"><img height="40" width="40" src="https://secure.gravatar.com/avatar/7c385bfa009587015f6b16e3e4ab5d53?s=40"> Benjamin Longaeret</a> <br>and many <a href="https://github.com/angular-translate/angular-translate/contributors">others</a></p>
<p>Logo designed by <a href="http://stefankroeckel.tumblr.com/">Stefan Kröckel</a></p>
</div>
</footer>
</body>
</html>