diff --git a/app/assets/javascripts/angular/directives/components/modal-loading-directive.js b/app/assets/javascripts/angular/directives/components/modal-loading-directive.js
index ec329ece1b..c8ba7ea431 100644
--- a/app/assets/javascripts/angular/directives/components/modal-loading-directive.js
+++ b/app/assets/javascripts/angular/directives/components/modal-loading-directive.js
@@ -33,6 +33,9 @@ angular.module('openproject.uiComponents')
   return {
     restrict: 'E',
     templateUrl: '/templates/components/modal_loading.html',
-    scope: true
+    scope: true,
+    link: function(scope, element, attributes) {
+      scope.I18n = I18n;
+    }
   };
 }]);
diff --git a/app/assets/javascripts/angular/directives/components/progress-bar-directive.js b/app/assets/javascripts/angular/directives/components/progress-bar-directive.js
index 6183b41648..b6501118d2 100644
--- a/app/assets/javascripts/angular/directives/components/progress-bar-directive.js
+++ b/app/assets/javascripts/angular/directives/components/progress-bar-directive.js
@@ -29,7 +29,7 @@
 // TODO move to UI components
 angular.module('openproject.uiComponents')
 
-.directive('progressBar', [function() {
+.directive('progressBar', ['I18n', function(I18n) {
   return {
     restrict: 'EA',
     replace: true,
@@ -40,6 +40,8 @@ angular.module('openproject.uiComponents')
     },
     templateUrl: '/templates/components/progress_bar.html',
     link: function(scope) {
+      scope.I18n = I18n;
+
       // apply defaults
       scope.width = scope.width || '100px';
       scope.legend = scope.legend || '';
diff --git a/app/assets/javascripts/angular/directives/components/table-pagination-directive.js b/app/assets/javascripts/angular/directives/components/table-pagination-directive.js
index 46beab0af3..08759de63d 100644
--- a/app/assets/javascripts/angular/directives/components/table-pagination-directive.js
+++ b/app/assets/javascripts/angular/directives/components/table-pagination-directive.js
@@ -28,7 +28,7 @@
 
 angular.module('openproject.uiComponents')
 
-.directive('tablePagination', ['PaginationService', function(PaginationService) {
+.directive('tablePagination', ['I18n', 'PaginationService', function(I18n, PaginationService) {
   return {
     restrict: 'EA',
     templateUrl: '/templates/components/table_pagination.html',
@@ -37,6 +37,7 @@ angular.module('openproject.uiComponents')
       updateResults: '&'
     },
     link: function(scope, element, attributes) {
+      scope.I18n = I18n;
       scope.paginationOptions = PaginationService.getPaginationOptions();
 
       scope.selectPerPage = function(perPage){
diff --git a/app/assets/javascripts/angular/directives/work_packages/filter-clear-directive.js b/app/assets/javascripts/angular/directives/work_packages/filter-clear-directive.js
index fba4ffd3d2..8bd503f8b5 100644
--- a/app/assets/javascripts/angular/directives/work_packages/filter-clear-directive.js
+++ b/app/assets/javascripts/angular/directives/work_packages/filter-clear-directive.js
@@ -28,12 +28,13 @@
 
 angular.module('openproject.workPackages.directives')
 
-.directive('filterClear', [function(){
+.directive('filterClear', ['I18n', function(I18n){
   return {
     restrict: 'E',
     templateUrl: '/templates/work_packages/filter_clear.html',
     scope: true,
     link: function(scope, element, attributes) {
+      scope.I18n = I18n;
       scope.clearQuery = function(){
         scope.$emit('queryResetRequired');
       };
diff --git a/config/locales/js-de.yml b/config/locales/js-de.yml
index f2a7e38df5..0d7d711e22 100644
--- a/config/locales/js-de.yml
+++ b/config/locales/js-de.yml
@@ -75,18 +75,22 @@ de:
     label_in_more_than: "in mehr als"
     label_less_or_equal: "<="
     label_less_than_ago: "vor weniger als"
+    label_loading: "Lade..."
     label_me: "ich"
     label_menu_collapse: "ausblenden"
     label_menu_expand: "einblenden"
     label_more_than_ago: "vor mehr als"
     label_move_column_left: "Spalte nach links verschieben"
     label_move_column_right: "Spalte nach rechts verschieben"
+    label_next: "Weiter"
     label_no_data: "Nichts anzuzeigen"
     label_none: "kein"
     label_not_contains: "enthält nicht"
     label_not_equals: "ist nicht"
     label_open_menu: "Menü öffnen"
     label_open_work_packages: "offen"
+    label_previous: "Zurück"
+    label_per_page: "Pro Seite:"
     label_remove_columns: "Ausgewählte Spalten entfernen"
     label_sort_by: "Sortiere nach"
     label_sorted_by: "sortiert nach"
@@ -97,6 +101,7 @@ de:
     label_this_week: "aktuelle Woche"
     label_today: "heute"
     label_work_package: "Arbeitspaket"
+    label_total_progress: "Gesamtfortschritt"
 
     text_are_you_sure: "Sind Sie sicher?"
 
@@ -220,6 +225,7 @@ de:
         insert_columns: "Spalten hinzufügen ..."
         filters: "Filter"
         display_sums: "Summen anzeigen"
+      button_clear: "Zurücksetzen"
     toolbar:
       settings:
         columns: "Spalten ..."
diff --git a/config/locales/js-en.yml b/config/locales/js-en.yml
index e26964c6da..ee58e10e92 100644
--- a/config/locales/js-en.yml
+++ b/config/locales/js-en.yml
@@ -75,18 +75,22 @@ en:
     label_in_more_than: "in more than"
     label_less_or_equal: "<="
     label_less_than_ago: "less than days ago"
+    label_loading: "Loading..."
     label_me: "me"
     label_menu_collapse: "collapse"
     label_menu_expand: "expand"
     label_more_than_ago: "more than days ago"
     label_move_column_left: "Move column left"
     label_move_column_right: "Move column right"
+    label_next: "Next"
     label_no_data: "No data to display"
     label_none: "none"
     label_not_contains: "doesn't contain"
     label_not_equals: "is not"
     label_open_menu: "Open menu"
     label_open_work_packages: "open"
+    label_previous: "Previous"
+    label_per_page: "Per page:"
     label_remove_columns: "Remove selected columns"
     label_sort_by: "Sort by"
     label_sorted_by: "sorted by"
@@ -96,6 +100,7 @@ en:
     label_today: "today"
     label_this_week: "this week"
     label_work_package: "Work package"
+    label_total_progress: "Total progress"
 
     text_are_you_sure: "Are you sure?"
 
@@ -223,6 +228,7 @@ en:
         insert_columns: "Insert columns ..."
         filters: "Filters"
         display_sums: "Display Sums"
+      button_clear: "Clear"
     toolbar:
       settings:
         columns: "Columns ..."
diff --git a/karma/tests/directives/components/table_pagination-test.js b/karma/tests/directives/components/table_pagination-test.js
index 3b569cf456..7d06918e94 100644
--- a/karma/tests/directives/components/table_pagination-test.js
+++ b/karma/tests/directives/components/table_pagination-test.js
@@ -32,13 +32,14 @@ describe('tablePagination Directive', function () {
   beforeEach(angular.mock.module('openproject.uiComponents', 'openproject.services'));
   beforeEach(module('templates'));
 
-  beforeEach(inject(function ($rootScope, $compile) {
-    var html;
+  beforeEach(inject(function ($rootScope, $compile, _I18n_) {
+    var html, I18n, t;;
     html = '<table-pagination total-entries="tableEntries" icon-name="totalResults" update-results="showUserSomething()"></table-pagination>';
 
     element = angular.element(html);
     rootScope = $rootScope;
     scope = $rootScope.$new();
+    I18n = _I18n_;
 
     compile = function () {
       $compile(element)(scope);
@@ -47,7 +48,7 @@ describe('tablePagination Directive', function () {
   }));
 
   describe('page ranges and links', function () {
-    beforeEach(function() {
+    beforeEach(function() {    
       compile();
     });
 
@@ -87,8 +88,17 @@ describe('tablePagination Directive', function () {
   });
 
   describe('perPage options', function () {
-    it('should always render perPage options', function () {
+    beforeEach(function() {    
+      t = sinon.stub(I18n, 't');
+      t.withArgs('js.label_per_page').returns('Per page:');
       compile();
+    });
+
+    afterEach(inject(function() {
+      I18n.t.restore();
+    }));
+
+    it('should always render perPage options', function () {
       var perPageOptions = element.find('span.per_page_options');
 
       expect(perPageOptions.text()).to.include('Per page:');
diff --git a/public/templates/components/modal_loading.html b/public/templates/components/modal_loading.html
index 6193242058..ee24040fe2 100644
--- a/public/templates/components/modal_loading.html
+++ b/public/templates/components/modal_loading.html
@@ -1,4 +1,4 @@
 <div ng-if="isLoading"
      id="ajax-indicator">
-  <span>Loading...</span>
+  <span>{{ I18n.t('js.label_loading') }}</span>
 </div>
diff --git a/public/templates/components/progress_bar.html b/public/templates/components/progress_bar.html
index b58d446806..c12e21df65 100644
--- a/public/templates/components/progress_bar.html
+++ b/public/templates/components/progress_bar.html
@@ -7,5 +7,5 @@
       </tr>
     </tbody>
   </table>
-  <p class="progress-bar-legend">{{legend}} Total progress</p>
+  <p class="progress-bar-legend">{{ legend + ' ' + I18n.t('js.label_total_progress') }}</p>
 </div>
diff --git a/public/templates/components/table_pagination.html b/public/templates/components/table_pagination.html
index 29ed6510e8..e051f7c04e 100644
--- a/public/templates/components/table_pagination.html
+++ b/public/templates/components/table_pagination.html
@@ -3,7 +3,7 @@
      ng-click="showPage(paginationOptions.page - 1)"
      class="previous_page"
      rel="prev start"
-     href="">Previous
+     href="">{{ I18n.t('js.label_previous') }}
   </a>
 
   <span ng-if="prePageNumbers" ng-repeat="pageNumber in prePageNumbers">
@@ -35,13 +35,13 @@
      ng-click="showPage(paginationOptions.page + 1)"
      class="next_page"
      rel="next"
-     href="">Next
+     href="">{{ I18n.t('js.label_next') }}
   </a>
 
   <span class="range">{{ currentRange }}</span>
 
   <span class="per_page_options">
-    Per page:
+    {{ I18n.t('js.label_per_page') }}
     <span ng-repeat="perPageOption in paginationOptions.perPageOptions">
       <span ng-if="perPageOption != paginationOptions.perPage">
         <a href="" ng-click="selectPerPage(perPageOption)">{{ perPageOption }}</a>
diff --git a/public/templates/work_packages/filter_clear.html b/public/templates/work_packages/filter_clear.html
index 4d63d38204..913e07d190 100644
--- a/public/templates/work_packages/filter_clear.html
+++ b/public/templates/work_packages/filter_clear.html
@@ -1,3 +1,3 @@
 <span>
-  <a href="" class="icon icon-undo" ng-click="clearQuery()">Clear</a>
+  <a href="" class="icon icon-undo" ng-click="clearQuery()">{{ I18n.t('js.work_packages.button_clear') }}</a>
 </span>