ng-disable не работает в элементе SVG
Я работаю над директивой angularjs, в которой элемент круга необходимо отключить, если на него щелкнуть один раз. Событие ng-click работает как положено, но ng-disable не работает. Я вижу, что отключенный класс добавляется в HTML, но событие щелчка по-прежнему срабатывает.
Какие-нибудь мысли?
<svg width="100" height="100">
<circle ng-disabled="disableme" ng-click="clickme()" ng-init="count=0" cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.clickme = function () {
$scope.count=$scope.count+1;
$scope.disableme = true;
};
1 ответ
Решение
ng-disabled
не работает на SVG. Кроме того, вы можете сделать это с ng-class
.disable {
pointer-events: none;
opacity: 0.5;
}
Добавить ng-class
к svg
элемент
<svg width="100" height="100" ng-class="{'disable': disableme}">
<circle ng-click="clickme()" ng-init="count=0" cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>