1

Привет всем, у меня есть язык ввода множественного выбора. На выбранном языке мне нужно открыть текстовые поля выбранного языка с динамической ng-моделью. это мой json и код.динамическая ng-модель с использованием нескольких выпадающих списков и ng-reapeat

[{"id":"1","lang":"English"},{"id":"2","lang":"Arabic"},{"id":"3","lang":"Français"}] 

<select class="form-control" ng-model="language" multiple required > 
    <option value="" disabled="">Select Language</option> 
    <option ng-repeat="l in lang" value="{{l.id}}">{{l.lang}}</option> 
</select> 

<div class="form-group" ng-repeat="lng in language" > 
    <label class="col-md-2" style="padding-right: 0px;">Name {{lang[lng-1].lang}}</label> 
    <div class="col-md-10" > 

     <input type="text" ng-model="typename.lang[lng-1].id" required > 
    </div> 

+0

Да Рохит проверил его. Как и я думал, что я был реализован, но это не сработало для меня, поэтому я сделал это в некотором роде. но да, ваша логика правильная. Цените логику –

+0

Спасибо Pankaj за оценку. Можете ли вы отметить этот ответ как правильный, чтобы он был полезен и для других. –

ответ

1

лично я хотел бы использовать нг-параметры вместо нг-повтора, как этот

контроллер:

$scope.inputs = []; 
    $scope.languagues = [{"id":"1","lang":"English"},{"id":"2","lang":"German"},{"id":"3","lang":"Spanish"}]; 
    $scope.showTextbox= function (option) { 
     $scope.inputs = []; 
     for(var i = 0; i < option.length; i++){ 
      $scope.inputs.push({name: option[i], value: 'test'+i}) 
     } 
    }  

HTML:

<select class="form-control" ng-model="language" ng-options="option.lang as option.lang for option in languagues" ng-change="showTextbox(language)" multiple required ></select> 
    <div ng-repeat="item in inputs"> 
    <br> 
    <label>{{item.name}}</label><br> 
    <input type="text" ng-model="item.value" required > 
    <p> 
     {{item.value}} 
    </p> 
    </div> 

Вот является скрипка, показывающая чанг эс Fiddle

+0

Благодарим за ответ, но у меня нет проблемы с опцией или опцией ng, оба работают одинаково. –

+0

Тогда я не понимаю проблему, что не работает? – stackg91

+0

У меня проблема, когда я выбираю 2 варианта, тогда появится 2 текстовых поля, но я не смогу получить или установить значение в этом текстовом поле с помощью ng-модели. –

2

Попробуйте это:

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    $scope.lang = [{ 
 
\t "id": "1", 
 
\t "lang": "English" 
 
}, { 
 
\t "id": "2", 
 
\t "lang": "Arabic" 
 
}, { 
 
\t "id": "3", 
 
\t "lang": "Français" 
 
}]; 
 

 
$scope.submitLang = function(selectedLang) { 
 
console.log(selectedLang); 
 
} 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <select class="form-control" ng-model="language" ng-options="option.lang for option in lang" multiple required ></select> 
 
    <div ng-repeat="lng in language"> 
 
    <label>{{lng.lang}}</label> 
 
    <input type="text" ng-model="selectedLang" required ng-change="submitLang(selectedLang)"> 
 
    </div> 
 
    </div>