0
我用這個custom Drop-Down list guide在Angular 1.0.7上創建了一個將在所有瀏覽器上支持的花式dropdown list
。 一切工作正常,你可以在這個Plunk看到。雙擊展開Angular 1.2.x上的自定義下拉列表
然後我決定升級到Angular 1.2.x. 關於新的角度似乎總是第一次運行第一次點擊並不擴大 drop-down
list
。 後,我雙擊drop-down
也可以再次工作正常像角1.0.7
示例 - Plunk
我怎樣才能讓我的drop-down
list
對角的1.2.x首先點擊擴大而不是雙點擊我的application
第一次運行?
我的HTML:
<body ng-controller="VotesCtrl">
<p>This is from index.html</p>
<div dropdown="" class="{{temp}} wrapper-dropdown-3" ng-click="temp='active'">
<i class="arrow"></i>
<span>{{selected}}</span>
<ul class="dropdown">
<li ng-repeat="status in statuses">
<a ng-click="change(status)" href="#">{{status}}</a>
</li>
</ul>
</div>
</body>
我的JS:
var webApp = angular.module('webApp', []);
//controllers
webApp.controller ('VotesCtrl', function ($scope) {
$scope.statuses = ["Approved","Pending","Trash","Spam"];
$scope.selected = $scope.statuses[0];
$scope.change = function(status) {
console.log(status);
$scope.selected = status;
};
});
webApp.controller ('tempCtrl', function ($scope) {
$scope.statuses = ["Approved","Pending","Trash","Spam"];
$scope.selected = $scope.statuses[0];
$scope.change = function(status) {
$scope.selected = status;
};
});
//services
//directive
webApp.directive('dropdown', function() {
angular.element(document).click(function() {
// all dropdowns
angular.element('.wrapper-dropdown-3').removeClass('active');
});
return {
restrict: 'A',
link: function(scope, elem, attrs) {
// var dd = new DropDown(elem);
angular.element(elem).on('click', function(event) {
angular.element(this).toggleClass('active');
return false;
});
}
};
});