[I18n] Add one-time binding to angularjs i18n

packages/kbn-i18n/src/angular/directive.js

@@ -16,28 +16,21 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-
 export function i18nDirective(i18n) {
   return {
     restrict: 'A',
     scope: {
       id: '@i18nId',
       defaultMessage: '@i18nDefaultMessage',
-      values: '=i18nValues',
+      values: '<i18nValues',
     },
     link: function($scope, $element) {
-      $scope.$watchGroup(['id', 'defaultMessage', 'values'], function([
-        id,
-        defaultMessage = '',
-        values = {},
-      ]) {
-        $element.html(
-          i18n(id, {
-            values,
-            defaultMessage,
-          })
-        );
-      });
+      $element.html(
+        i18n($scope.id, {
+          values: $scope.values,
+          defaultMessage: $scope.defaultMessage,
+        })
+      );
     },
   };
 }

src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/edit_index_pattern.html

@@ -5,7 +5,7 @@
       data-test-subj="editIndexPattern"
       class="kuiViewContent"
       role="region"
-      aria-label="{{'kbn.management.editIndexPattern.detailsAria' | i18n: { defaultMessage: 'Index pattern details' } }}"
+      aria-label="{{::'kbn.management.editIndexPattern.detailsAria' | i18n: { defaultMessage: 'Index pattern details' } }}"
     >
       <!-- Header -->
       <kbn-management-index-header
@@ -103,9 +103,9 @@
             <input
               class="kuiSearchInput__input"
               type="text"
-              aria-label="{{'kbn.management.editIndexPattern.fields.filterAria' | i18n: {defaultMessage: 'Filter'} }}"
+              aria-label="{{::'kbn.management.editIndexPattern.fields.filterAria' | i18n: {defaultMessage: 'Filter'} }}"
               ng-model="fieldFilter"
-              placeholder="{{'kbn.management.editIndexPattern.fields.filterPlaceholder' | i18n: {defaultMessage: 'Filter'} }}"
+              placeholder="{{::'kbn.management.editIndexPattern.fields.filterPlaceholder' | i18n: {defaultMessage: 'Filter'} }}"
               data-test-subj="indexPatternFieldFilter"
             >
           </div>

src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/field_controls.html

@@ -2,7 +2,7 @@
   <a
     data-test-subj="indexPatternFieldEditButton"
     ng-href="{{ kbnUrl.getRouteHref(field, 'edit') }}"
-    aria-label="{{'kbn.management.editIndexPattern.editFieldButton' | i18n: { defaultMessage: 'Edit' } }}"
+    aria-label="{{::'kbn.management.editIndexPattern.editFieldButton' | i18n: { defaultMessage: 'Edit' } }}"
     class="kuiButton kuiButton--basic kuiButton--small"
   >
     <span aria-hidden="true" class="kuiIcon fa-pencil"></span>
@@ -12,7 +12,7 @@
     ng-if="field.scripted"
     ng-click="remove(field)"
     class="kuiButton kuiButton--danger kuiButton--small"
-    aria-label="{{'kbn.management.editIndexPattern.deleteFieldButton' | i18n: { defaultMessage: 'Delete' } }}"
+    aria-label="{{::'kbn.management.editIndexPattern.deleteFieldButton' | i18n: { defaultMessage: 'Delete' } }}"
   >
     <span aria-hidden="true" class="kuiIcon fa-trash"></span>
   </button>

src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/index_header/index_header.html

@@ -18,8 +18,8 @@
     <button
       ng-if="setDefault"
       ng-click="setDefault()"
-      aria-label="{{'kbn.management.editIndexPattern.setDefaultAria' | i18n: { defaultMessage: 'Set as default index' } }}"
-      tooltip="{{'kbn.management.editIndexPattern.setDefaultTooltip' | i18n: { defaultMessage: 'Set as default index' } }}"
+      aria-label="{{::'kbn.management.editIndexPattern.setDefaultAria' | i18n: { defaultMessage: 'Set as default index' } }}"
+      tooltip="{{::'kbn.management.editIndexPattern.setDefaultTooltip' | i18n: { defaultMessage: 'Set as default index' } }}"
       class="kuiButton kuiButton--basic"
       data-test-subj="setDefaultIndexPatternButton"
     >
@@ -32,8 +32,8 @@
     <button
       ng-if="refreshFields"
       ng-click="refreshFields()"
-      aria-label="{{'kbn.management.editIndexPattern.refreshAria' | i18n: { defaultMessage: 'Reload field list' } }}"
-      tooltip="{{'kbn.management.editIndexPattern.refreshTooltip' | i18n: { defaultMessage: 'Refresh field list' } }}"
+      aria-label="{{::'kbn.management.editIndexPattern.refreshAria' | i18n: { defaultMessage: 'Reload field list' } }}"
+      tooltip="{{::'kbn.management.editIndexPattern.refreshTooltip' | i18n: { defaultMessage: 'Refresh field list' } }}"
       class="kuiButton kuiButton--basic"
     >
       <span
@@ -45,8 +45,8 @@
     <button
       ng-if="delete"
       ng-click="delete()"
-      aria-label="{{'kbn.management.editIndexPattern.removeAria' | i18n: { defaultMessage: 'Remove index pattern' } }}"
-      tooltip="{{'kbn.management.editIndexPattern.removeTooltip' | i18n: { defaultMessage: 'Remove index pattern' } }}"
+      aria-label="{{::'kbn.management.editIndexPattern.removeAria' | i18n: { defaultMessage: 'Remove index pattern' } }}"
+      tooltip="{{::'kbn.management.editIndexPattern.removeTooltip' | i18n: { defaultMessage: 'Remove index pattern' } }}"
       class="kuiButton kuiButton--danger"
       data-test-subj="deleteIndexPatternButton"
     >

src/core_plugins/kibana/public/management/sections/indices/index.html

@@ -1,4 +1,4 @@
-<div class="col-md-2 sidebar-container" role="region" aria-label="{{'kbn.management.editIndexPatternAria' | i18n: { defaultMessage: 'Index patterns' } }}">
+<div class="col-md-2 sidebar-container" role="region" aria-label="{{::'kbn.management.editIndexPatternAria' | i18n: { defaultMessage: 'Index patterns' } }}">
   <div class="sidebar-list">
     <div class="sidebar-item-title full-title">
       <h5 data-test-subj="createIndexPatternParent">

src/dev/i18n/__fixtures__/extract_default_translations/test_plugin_2/test_file.html

@@ -1 +1 @@
-<p>{{ 'plugin_2.message-id' | i18n: { defaultMessage: 'Message text' } }}</p>
+<p>{{ ::'plugin_2.message-id' | i18n: { defaultMessage: 'Message text' } }}</p>

src/dev/i18n/extractors/html.js

@@ -119,14 +119,33 @@ function trimCurlyBraces(string) {
   return string.slice(2, -2).trim();
 }
 
+function trimParentheses(string) {
+  if (string.startsWith('(') && string.endsWith(')')) {
+    return string.slice(1, -1);
+  }
+
+  return string;
+}
+
+function trimOneTimeBindingOperator(string) {
+  if (string.startsWith('::')) {
+    return string.slice(2);
+  }
+
+  return string;
+}
+
 function* getFilterMessages(htmlContent) {
   const expressions = (htmlContent.match(ANGULAR_EXPRESSION_REGEX) || [])
     .filter(expression => expression.includes(I18N_FILTER_MARKER))
     .map(trimCurlyBraces);
 
   for (const expression of expressions) {
     const filterStart = expression.indexOf(I18N_FILTER_MARKER);
-    const idExpression = expression.slice(0, filterStart).trim();
+    const idExpression = trimParentheses(
+      trimOneTimeBindingOperator(expression.slice(0, filterStart).trim())
+    );
+
     const filterObjectExpression = expression.slice(filterStart + I18N_FILTER_MARKER.length).trim();
 
     if (!filterObjectExpression || !idExpression) {