Dynamic `ng-model` in `ng-repeat` for multilingual inputs

Question

In my current multilingual Angularjs app, I have some inputs that have multiple values in each languages(en, fa, ar and ...) like this:

HTML

<div ng-repeat="lang in languages">
   <label> {{'TITLE' | translate}}</label>
   <input class='form-control'
       type='text'
       name="title"
       ng-model="createModel.lang['title']">
</div>

<div ng-repeat="lang in languages">
   <label> {{'NAME' | translate}}</label>
   <input class='form-control'
       type='text'
       name="name"
       ng-model="createModel.lang['name']">
</div>

JS

$rootScope.languages  = ['en', 'fa', 'ar']; // array of languages 

Means that, I want to have ng-model like these:

en: 
  ng-model='createModel.en["title"]'
  ng-model='createModel.en["name"]'
fa: 
  ng-model='createModel.fa["title"]'
  ng-model='createModel.fa["name"]'
ar: 
  ng-model='createModel.ar["title"]'
  ng-model='createModel.ar["name"]'

At last I want this for createModel:

createModel: {
    'en': ['title': 'title1' , 'name': 'Jone'],
    'fa': ['title': 'عنوان1' , 'name': 'جان'],
    'ar': ['title': '...' , 'name': '...']
}

So, How can I do this?

Answer 1

Change

createModel.lang['title']

to

createModel[lang].title

(and same for the name, obviously).

Also note that your JS code is invalid. It should be

createModel: {
  'en': {'title': 'title1' , 'name': 'Jone'},
  'fa': {'title': 'عنوان1' , 'name': 'جان'},
  'ar': {'title': '...' , 'name': '...'}
}

An array starts with [. An object starts with {.