AngularJS: выполнить функцию директивы при загрузке страницы

0

Это моя директива, которая обрабатывает popovers. Я использую angular-translate для перевода текста на разные языки:

angular.module('c2gyoApp')
  .directive('tariffPopover', [
    '$translate', 
    '$rootScope', 
    function ($translate, $rootScope) {
return {
  restrict: 'A',
  transclude: true,
  scope: {
    translateText: '@tariffPopover'
  },
  template:
    '<span ng-transclude></span>' +
    '&nbsp;' +
    '<span popover-placement="right" ' +
    '      uib-popover-html="text" ' +
    '      popover-trigger="mouseenter" ' +
    '      class="fa fa-info-circle">' +
    '</span>',
  controller: function ($scope) {
    $translate($scope.translateText).then(function (translatedText) {
      $scope.text = translatedText;
    });

    $rootScope.$on('$translateChangeSuccess', function () {
      $translate($scope.translateText).then(function (translatedText) {
        $scope.text = translatedText;
      });
    });

  }
};
}]);

Перевод выполняется, когда язык изменяется с помощью $rootScope.$on('$translateChangeSuccess'). Однако это не выполняется при загрузке страницы, поэтому я добавил строки для перевода текста снова в контроллер:

  controller: function ($scope) {
    $translate($scope.translateText).then(function (translatedText) {
      $scope.text = translatedText;
    });

    $rootScope.$on('$translateChangeSuccess', function () {
      $translate($scope.translateText).then(function (translatedText) {
        $scope.text = translatedText;
      });
    });

Есть ли способ выполнить перевод на pageload без дублирования кода?

Теги:
angularjs-directive
angular-translate
angularjs-service

2 ответа

1
Лучший ответ

Если все, что вы хотите сделать, это избежать копирования-вставки, то я думаю, что лучше объектно-ориентированная практика обернуть дублированный код в именованной функции, а не использовать анонимную функцию. Таким образом, его можно использовать повторно.

controller: function ($scope) {

  var translate = function(){
     $translate($scope.translateText).then(function (translatedText) {
         $scope.text = translatedText;
    });
  }

  $rootScope.$on('$translateChangeSuccess', translate);

  //execute the translation when the controller loads
  translate();
}
-1

Попробуйте заменить

$translateChangeSuccess с

$locationChangeSuccess чтобы сделать его эффективным при изменении страницы/местоположения.

Также вы можете использовать $viewContentLoaded если вы хотите получить его после загрузки содержимого на странице.

Надеюсь, это будет полезно..!

  • 0
    Это не работает
  • 0
    Можете ли вы показать мне ошибку, которую вы получаете в консоли?
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню