Geek asks and answers

Angularjs multilingual text box with ngmodel

I am trying to implement a multilingual text input field with a small drop down button on the left to select a language. For example, when the drop-down menu shows "de", the text field should be bound to model.multilingualData['de'].someField, etc.

My first approach was to install ngModel in model.multilingualData[selectedLanguage].someField. But when the user selects another language without filling in the field correctly, an error is not set in the form, since now the model points to another object.

My next idea was to create a whole element directive without ngModel, but then I could not do other checks like ngMaxLength.

I could not find anything useful on the Internet. Any idea on how to implement this correctly?

EDIT

Here is a small fiddle that illustrates the problem: http://jsfiddle.net/FZ2kg/

Not only does the form appear when switching languages, the previous field value is also deleted, since the model is set to nullwhen the field becomes invalid.

+3
source share
2 answers

it would be nice if you would use this amazing external directive for multilingualism!

https://angular-translate.imtqy.com/

I hope this helps

+3
source

If you need a form check for all language variations, and you download all the languages ​​in your model at once, can you just create an input for each language in the form and hide everything except the currently selected language?

: http://jsfiddle.net/jvl70/w3rstmwd/5/

<form name="myForm">        
    <div ng-repeat="(lang, value) in model.multilingualData" 
    ng-show="lang==stuff.currentLanguage">            
        <ng-form name="innerForm">
            <div ng-class="{ 'has-error': innerForm.anything.$invalid }">
                <input type="text" name="anything" ng-model="value.someField" ng-maxlength="6"/>
            </div>
        </ng-form>
    </div>        
</form>

( , , $invalid . . , : AngularJS. ng- .)

, , , .

0

More articles:


All Articles