Ошибка: "[$ controller: ctrlreg] http://errors.angularjs.org/1.7.4/$controller/ctrlreg?p0=AppCtrl" - PullRequest
0 голосов
/ 27 февраля 2019

Я хочу перевести свой веб-сайт / веб-страницу на 2 языка, но когда я нажимаю кнопки для изменения языка, ничего не происходит, и эта ошибка появляется в консоли.

Index.html

<html ng-app='mpdmApp' lang="en">
  <head>
      <base href="/">
    <meta charset="utf-8">

  <script src="assets/js/libs/angular.min.js"></script>
    <script src="assets/js/libs/angular-animate.js"></script>
    <script src="assets/js/libs/angular-sanitize.js"></script>

      <script src="assets/js/libs/angular-messages.min.js"></script>
    <script src="assets/js/libs/angular-aria.js"></script>
    <script src="assets/js/libs/angular-route.js"></script>
    <script src="assets/js/libs/angular-material.min.js"></script>
    <script src="app/app.js"></script>
    <script src="app/app.config.js"></script>

    <script src="app/seafood/seafood.module.js"></script>
    <script src="app/seafood/seafood.component.js"></script>

    <!--scripturi angular translate-->
        <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate/2.18.1/angular-translate.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-interpolation-messageformat/2.18.1/angular-translate-interpolation-messageformat.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-storage-cookie/2.18.1/angular-translate-storage-cookie.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-storage-local/2.18.1/angular-translate-storage-local.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-loader-url/2.18.1/angular-translate-loader-url.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-loader-static-files/2.18.1/angular-translate-loader-static-files.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-handler-log/2.18.1/angular-translate-handler-log.js"></script>
    <script src="app/script.js"></script>

  </head>

<body class="mp_sc_0">

    <mpdm-menu></mpdm-menu>

    <div ng-controller="MainCtrl">
      <div ng-view class="mpdmView"></div>
    </div>

</body>

app.js

var translationsEN = {
      seafood: 'Seafood',
      grill: 'Grill',
      BUTTON_LANG_DE: 'German',
      BUTTON_LANG_EN: 'English'
    };

    var translationsDE= {
      seafood: 'Preparate peste',
      grill: 'Preparate la gratar',
      BUTTON_LANG_DE: 'Deutsch',
      BUTTON_LANG_EN: 'Englisch'
    };

var mpdmApp = angular.module('mpdmApp', [
  'ngRoute', 'ngAnimate', 'ngSanitize','ngMaterial', 'ngMessages',  'mpdmSeafood', 'mpdmGrill', 'mpdmMeniu', 'pascalprecht.translate'
  ]);

 mpdmApp.config(['$translateProvider', function ($translateProvider) {
      // add translation tables
      $translateProvider.translations('en', translationsEN);
      $translateProvider.translations('de', translationsDE);
      $translateProvider.fallbackLanguage('de');
      $translateProvider.preferredLanguage('en');
    }]);

//----controllerul pentru traduceri
 mpdmApp.controller('MainCtrl', ['$translate', '$scope', function ($translate, $scope) {

      $scope.changeLanguage = function (langKey) {
        $translate.use(langKey);
      };
    }]);

mainpage.html - На этой странице я помещаю слова, которые хочу перевести.Я считаю, что из-за этой ошибки в консоли я не могу переключать языки.

 <div class="btn1">
   <a href="/seafood" translate="seafood"></a>
    </div>

    <div class="btn2>
    <a href="/grill">{{'grill' | translate}}</a>
      </div>

<button ng-click="changeLanguage('de')" translate="BUTTON_LANG_DE"></button>
 <button ng-click="changeLanguage('en')" translate="BUTTON_LANG_EN"></button>           

Ответы [ 2 ]

0 голосов
/ 28 февраля 2019

app.config.js

mpdmApp.config(function($routeProvider, $locationProvider) {
      $routeProvider
      .when('/', {
          template: '<mpdm-main-page></mpdm-main-page>'
        })
        .when('/seafood', {
          template: '<mpdm-seafood></mpdm-seafood>'
        })
        .when('/contact', {
          template: '<mpdm-contact></mpdm-contact>'
        })
        .when('/desprenoi', {
          template: '<mpdm-desprenoi></mpdm-desprenoi>'
        })
        .when('/multumim', {
          template: '<mpdm-multumim></mpdm-multumim>'
        })
        .when('/grill', {
          template: '<mpdm-grill></mpdm-grill>'
        })
        .when('/meniu', {
          template: '<mpdm-meniu></mpdm-meniu>'
        }).
                when('/notfound', {
          template: '<mpdm-coming-soon></mpdm-coming-soon>'
        }).
        otherwise({redirectTo:'/notfound'});

        $locationProvider.html5Mode(true);

    });
0 голосов
/ 27 февраля 2019

Я создал базовый пример, используя $translate.Не ясно, с какой проблемой вы столкнулись, поэтому, пожалуйста, будьте более конкретны.Кроме того, поскольку вы используете ng-view, где вы определили конфигурацию $routeProvider?

var translationsEN = {
      seafood: 'Seafood',
      grill: 'Grill',
      BUTTON_LANG_DE: 'German',
      BUTTON_LANG_EN: 'English'
    };

    var translationsDE= {
      seafood: 'Preparate peste',
      grill: 'Preparate la gratar',
      BUTTON_LANG_DE: 'Deutsch',
      BUTTON_LANG_EN: 'Englisch'
    };

var mpdmApp = angular.module('mpdmApp', ['pascalprecht.translate']);

 mpdmApp.config(['$translateProvider', function ($translateProvider) {
      // add translation tables
      $translateProvider.translations('en', translationsEN);
      $translateProvider.translations('de', translationsDE);
      $translateProvider.fallbackLanguage('de');
      $translateProvider.preferredLanguage('en');
    }]);

//----controllerul pentru traduceri
 mpdmApp.controller('MainCtrl', ['$translate', '$scope', function ($translate, $scope) {

      $scope.changeLanguage = function (langKey) {
        $translate.use(langKey);
      };
    }]);
<html ng-app='mpdmApp' lang="en">
  <head>
      <base href="/">
    <meta charset="utf-8">

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.4/angular.min.js"></script>


    <!--scripturi angular translate-->
        <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate/2.18.1/angular-translate.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-interpolation-messageformat/2.18.1/angular-translate-interpolation-messageformat.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-storage-cookie/2.18.1/angular-translate-storage-cookie.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-storage-local/2.18.1/angular-translate-storage-local.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-loader-url/2.18.1/angular-translate-loader-url.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-loader-static-files/2.18.1/angular-translate-loader-static-files.js"></script>
    <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-handler-log/2.18.1/angular-translate-handler-log.js"></script>
    <script src="app/script.js"></script>

  </head>

<body class="mp_sc_0" ng-controller="MainCtrl">

    <!--<mpdm-menu></mpdm-menu>-->

    <!--<div ng-controller="MainCtrl">
      <div ng-view class="mpdmView"></div>
      
    </div>-->
    
    <div class="btn1">
      <a href="/seafood" translate="seafood">Hello</a>
    </div>

     <div class="btn2">
      <a href="/grill">{{'grill' | translate}}</a>
     </div>

 <button ng-click="changeLanguage('de')" translate="BUTTON_LANG_DE"></button>
 <button ng-click="changeLanguage('en')" translate="BUTTON_LANG_EN"></button>    
 

</body>
...