回答編集履歴
2
a
answer
CHANGED
@@ -24,7 +24,7 @@
|
|
24
24
|
}
|
25
25
|
|
26
26
|
// 選択状態解除
|
27
|
-
$scope.
|
27
|
+
$scope.clearLocation = function(){
|
28
28
|
$scope.location = '';
|
29
29
|
}
|
30
30
|
|
@@ -39,7 +39,7 @@
|
|
39
39
|
<option value="東京">東京</option>
|
40
40
|
<option value="その他関東地区">その他関東地区</option>
|
41
41
|
</select>
|
42
|
-
<button ng-click="
|
42
|
+
<button ng-click="clearLocation()">未選択</button>
|
43
43
|
</div>
|
44
44
|
</body>
|
45
45
|
</html>
|
1
a
answer
CHANGED
@@ -4,4 +4,43 @@
|
|
4
4
|
|
5
5
|
以下のサンプルは複数選択して別の箇所をクリックしたときも$scope.locationの中身は失われていないように見えます.
|
6
6
|
|
7
|
-
[リンク](http://plnkr.co/edit/8GhnFmxNRvtJCGOyLUKg?p=preview)
|
7
|
+
[リンク](http://plnkr.co/edit/8GhnFmxNRvtJCGOyLUKg?p=preview)
|
8
|
+
|
9
|
+
上記リンク先を以下に変更しました。
|
10
|
+
|
11
|
+
```html
|
12
|
+
<html>
|
13
|
+
<head>
|
14
|
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
|
15
|
+
|
16
|
+
<script>
|
17
|
+
angular.module('App', []).controller('formController', ['$scope', function($scope) {
|
18
|
+
// 初期値はブランク
|
19
|
+
$scope.location = '';
|
20
|
+
|
21
|
+
// bindは条件で分岐
|
22
|
+
$scope.selectedLocation = function(){
|
23
|
+
return $scope.location === '' ? '旅行地を選択' : $scope.location;
|
24
|
+
}
|
25
|
+
|
26
|
+
// 選択状態解除
|
27
|
+
$scope.crearLocation = function(){
|
28
|
+
$scope.location = '';
|
29
|
+
}
|
30
|
+
|
31
|
+
}]);
|
32
|
+
</script>
|
33
|
+
</head>
|
34
|
+
<body ng-app="App">
|
35
|
+
<div ng-controller="formController">
|
36
|
+
<div class="sel1" ng-bind="selectedLocation()"></div>
|
37
|
+
<select class="op1" multiple size="2" ng-model="location">
|
38
|
+
<option value="" disabled>旅行地を選択</option>
|
39
|
+
<option value="東京">東京</option>
|
40
|
+
<option value="その他関東地区">その他関東地区</option>
|
41
|
+
</select>
|
42
|
+
<button ng-click="crearLocation()">未選択</button>
|
43
|
+
</div>
|
44
|
+
</body>
|
45
|
+
</html>
|
46
|
+
```
|