我正在使用ng-repeat動態表單。我正在使用oi-select庫來加載我的位置。 oi選擇框具有多選功能。在我的頁面加載默認情況下,我正在加載第一個選項值在該oi選擇框中。在角度oi選擇多個選項中覆蓋的ng-init值
但我正在使用多選功能,如果我選擇任何其他選項,而不是第一個選項,它會被該值覆蓋。由於這個問題,我必須再次選擇第一個選項。我的問題是,我如何將默認的第一個選項值加載到oi-select中?
之後,如果我選擇的任何其他選項則無法覆蓋在選擇框中我的第一個值。這裏是我的plunker鏈接http://plnkr.co/edit/m6Q02dlHLBCMVLRLfioh?p=preview
我的HTML代碼
<body class="container row">
<div ng-app="myApp">
<div ng-controller="myCtrl">
<form role="form" name='userForm' novalidate>
<div class="container">
<div class="row" ng-repeat="user in users">
<div class="form-group">
<div class="col-md-3">
<label>ID</label>
<input ng-model="user.id" id="user.id" name="user.id" placeholder="Enter bugid" type="text" required readonly disabled>
</div>
<div class="col-md-3">
<label>Comments</label>
<textarea ng-model="user.comment" id="textarea1" rows="1" required></textarea>
</div>
<div class="col-md-3 ">
<label>Location</label>
<oi-select ng-model="user.location" multiple oi-options="v for v in locations" ng-init='initLocation(user)' name="select2" required>
</oi-select>
</div>
</div>
</div>
</div>
<div class="buttonContainer text-center btn-container">
<br>
<button ng-disabled="userForm.$invalid" type="button" id="adduser" ng-click="adduser()">Add user</button>
<button type="button" class="btn button--default btn--small pull-center">Close</button>
</div>
</form>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" type="text/css" />
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
</div>
</div>
我的js代碼
var app = angular.module('myApp', ['ngResource', 'oi.select']);
app.controller('myCtrl', function($scope, $timeout) {
$scope.ids = [1, 2, 3];
$scope.users = $scope.ids.map(function(id) {
return {
id: id,
comment: "",
location: ""
};
});
$scope.locations = ['india', 'usa', 'jermany', 'china', 'Dubai'];
$scope.initLocation = (user) => {
$timeout(() => {
user.location = $scope.locations[0];
});
}
$scope.adduser = function() {
var data = $scope.users.map(function(user) {
return {
"userid": user.id,
"manualcomment": user.comment,
"location": user.location
}
});
console.log("data", data)
}
});
是你能解決這個問題? –
如果位置是靜態數據,它工作正常。但根據我的新要求,我在模態彈出窗口中加載此表單。我的位置值來自api調用。只有第一次,如果我點擊我的模態彈出按鈕我的第一個位置數據默認情況下沒有加載選擇框,ng-init()方法不起作用。但如果我再次點擊彈出按鈕它的工作正常。第一次沒有加載第一個位置值。我在這裏附上了我的plunker鏈接。請幫助我.https://plnkr.co/edit/xDVetaZIzpFdKLS9ihU6?p =預覽 – user3760261