AngularJS - переменные, не обновляемые в поле зрения (не используя область)

У меня проблема с угловым, Часть моей переменной не обновляется после изменения их значений. Мой заголовок обновляется только отлично, мой нижний колонтитул остается только с их начальными значениями.AngularJS - переменные, не обновляемые в поле зрения (не используя область)

Вот некоторые код:

<body> 
    <!-- Navigation --> 
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
     <div class="container" ng-controller="LanguageController as language"> 
      <!-- Brand and toggle get grouped for better mobile display --> 
      <div class="navbar-header"> 
       <a class="navbar-brand" href="#"> {{ language.lblAppName }}</a> 
      </div> 
      <div class="vertical-center" id="language"> 
       <label> {{ language.lblSelectLanguage }} </label> 
       <select ng-options="item for item in language.languages" ng-model="language.selectedLanguage" ng-change="language.changeLanguage()"></select> 
       <button ng-click="language.editLanguage()">{{ language.lblEditLanguage }}</button> 
      </div> 
     </div> 
    </nav> 

    <!-- there will be an ng-route directive here later on --> 
    <nav class="navbar navbar-inverse navbar-fixed-bottom" role="navigation"> 
    <div class="container-fluid" ng-controller="LanguageController as language"> 
     <div class="navbar-header"> 
     <div class="navbar-brand"> {{ language.lblFooter }} </div> 
     </div> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#"> {{ language.lblMainPage }} </a></li> 
     <li><a href="#">placeholder</a></li> 
     <li><a href="#">placeholder</a></li> 
     <li><a href="#">placeholder</a></li> 
     </ul> 
    </div> 
    </nav> 
</body>

Все мои переменные обновления прекрасно здесь "language.lblFooter" и "language.lblFooter" за исключением.

здесь декларация моего модуля

(function(){ 

// note: when calling angular.module("moduleName,["dependancies"]) a new module is created. 
//  when callung angular.module("moduleName") the module "modulename" is called. 
/** @module 
* Creation of the application module: CarViewer */ 

angular.module("carViewer", []); 
}());

А вот выдержки из кода, который обновляет переменные:

var vm = this; 
/** 
    * Initialise the retrieve sequence. 
    * @function 
    * @private 
    */ 
    function activate() { 
     // work fine the strings are returned from the backend correctly 
     return languageService.getLanguages() 
       .then(onLanguagesComplete, OnError); 
    } 

/** 
    * Is called when the language retrieve is completed 
    * assign the different variables 
    * @function 
    * @private 
    * @param {string[]} data - The data returned by the getLanguages() function 
    */ 
    function onLanguagesComplete(data) { 

     vm.languages = data.languages; // list of all available languages 
     vm.strings = data.strings; // Two dimentional array containing the strings in every language 

     vm.selectedLanguage = vm.languages[DEFAULT_LANGUAGE]; 

     assignStrings(DEFAULT_LANGUAGE); 
    }; 

/** 
    * Assign the new strings into the different variables 
    * @function 
    * @private 
    */ 
    function assignStrings(language) { 

     // Different labels 
     vm.lblSelectLanguage = vm.strings[language].lblSelectLanguage; 
     vm.lblEditLanguage = vm.strings[language].lblEditLanguage; 
     vm.lblAppName = vm.strings[language].lblAppName; 
     vm.lblMainPage = vm.strings[language].lblMainPage; 
     vm.lblFooter = vm.strings[language].lblFooter; 
    } 

// and the changeLanguage that is called by the view 
/** 
    * Allow the DOM to changes the language displayed, 
    * @function 
    * @public 
    */ 
    function changeLanguage(){ 
     assignStrings(vm.languages.indexOf(vm.selectedLanguage)); 
    }

Так каждые переменные корректно обновляются только для на в сноске , Вы понимаете, почему?

Я видел, что эту проблему можно решить, используя $ scope.apply(), но я не использую $ scope? Я пробовал это. $ Digest и this. $ Apply, но не работает.

EDIT: Я пытался использовать $ scope только для $ scope. $ Apply(); но он не работает. Я хочу уточнить, что я использую $ http для извлечения файла .json.

Большое спасибо.

источник

2016-09-16 Sherokan

Почему бы не использовать $ scope? –

@MikeTung, его код, похоже, придерживается «Углового гида стиля» Джона Папы. –

@DavidR точно! :) – Sherokan

У вас есть 2 экземпляра контроллера. Когда вы делаете ng-change="language.changeLanguage(), он обновляет только этот контроллер.

Таким образом, в сноске там никогда не называли changeLanguage()

Рассмотрим рефакторинг и с помощью службы или фабрику для этого изменения языка

EDIT
Вы также могли бы сделать
<body ng-controller="LanguageController as language">
поскольку у вас есть контроллер, так как он ничего не повлияет на него

источник

2016-09-16 14:19:42 taguenizy

О, я думал, что все было одноточечным в Угловом. Это объяснит это. Есть ли возможность использовать тот же экземпляр, что и раньше? Создание сервиса будет бесполезно с моей архитектурой (я разрабатываю структуру, которая должна быть очень модульной, и каждый модуль должен быть независимым). – Sherokan

определите контроллер в теге , и вы будете только одним экземпляром –

@Sherokan, вы можете использовать предложение Joaozito Polo, поместить его в тело, так как у вас есть 'controller as', он не будет влиять ни на что, что он не должен – taguenizy

AngularJS - переменные, не обновляемые в поле зрения (не используя область)

ответ

Смежные вопросы