javascript - Data binding inside <option> element in angular.js and jQuery mobile -


i have added multi-language support jquery-mobile/phonegap app using this great repo on github.

it uses firebase , angular.js bind language dependant labels , texts in app selected language, in example:

<h2>{{getword("selection_criteria")}}</h2> 

however, there language-dependant texts in app cannot bound language data, have found far:

<select id="sel" data-role="slider">     <option value="off">{{getword("select_off")}}</option>     <option value="on">{{getword("select_on")}}</option> </select> 

the <option> element doesn't allow bind it's text data (the rendered text empty). don't know why. tried test whether work:

<option value="off">{{1+2}}</option> 

and yes, displayed number 3 in slider.

the angular.js part looks this:

function languagectrl($scope) {      $scope.words = json.parse('{}');      $scope.addword = function(name, value) {         $scope.words[name] = value;     };      $scope.getword = function(name) {         return $scope.words[name];     }; }  var ref; var reflang; var onlangchange;  $(document).on("pageinit", "#mainpage", function(event) {     ref = new firebase('https://username.firebaseio.com/');     changelangto("en"); //default lang });  function changelangto(lang) {     if (onlangchange !== undefined && onlangchange !== undefined) {         reflang.off('child_changed', onlangchange);     }      reflang = ref.child(lang);      //reading once words     reflang.once('value', function(datasnapshot) {         var lang = datasnapshot.val();         angular.element($("#mainpage")).scope().$apply(function(scope) {             $.each(lang, function(key, value) {                 scope.addword(key, value);             });         });     });      //listening changes     onlangchange = reflang.on('child_changed', function(childsnapshot, prevchildname) {         angular.element($("#mainpage")).scope().$apply(function(scope) {             scope.addword(childsnapshot.name(), childsnapshot.val());         });     }); 

the json firebase parsed variable simple, like:

{     "cz": {         "select_on":"ano",         "select_off":"ne"     },      "en": {         "select_on":"on",         "select_off":"off"     } } 

i think <button> element won't work, too. , there cases of setting element text via attribute, in case:

<ul data-filter-placeholder="search items..."></ul> 

i make work, too:

<ul data-filter-placeholder="{{getword("search_items")}}"></ul> 

i new angular.js, can please explain me how make work? have read documentation on html select element angular data-binding, not quite understand how apply it.

thanks!


Comments

Popular posts from this blog

php - Calling a template part from a post -

Firefox SVG shape not printing when it has stroke -

How to mention the localhost in android -