2

Самая примитивная задача: по нажатию пробела брать из ngrepeat первый элемент и после чтения удалять из контроллера. Берёт, но не удаляет. Что я тут делаю не так?

Контроллер:

angular.module('example', []).controller('ctrl', function ($scope) {
    $scope.items = ['Cats', 'Dogs', 'Elephants', 'Rat', 'Crab'];

    $scope.select = function (item) {
        alert('You selected item "' + item + '"');
        $scope.items.splice($scope.items.indexOf(item), 1);
    }; 

    document.onkeydown = function(e) {
        if (e.which == 32) {
            $scope.select($scope.items[0]);
        }
    };
});

Страница:

<div ng-app="example" ng-controller="ctrl">
    <ul>
        <li ng-repeat="item in items"> 
            <a ng-click="select(item)">{{item}}</a>
        </li>
    </ul>
</div>

jsfiddle: http://jsfiddle.net/6k82ny3r/

1 ответ 1

2

Событие document.onkeydown происходит вне angular, после него нужно обновлять $scope.

  $scope.$digest();

Можно еще повесить слушателя на изменения $scope.items и при изменении опять же обновлять $scope. Примерно так:

$scope.$watch('items', function(newValue) {
    $scope.$digest();
});

angular.module('example', []).controller('ctrl', function ($scope) {
    $scope.items = ['Cats', 'Dogs', 'Elephants', 'Rat', 'Crab'];
    $scope.select = function (item) {
        $scope.items.splice($scope.items.indexOf(item), 1);
         alert('You selected item "' + item + '"');

         $scope.$digest();
    }; 
    
    document.onkeydown = function(e) {
        if (e.which == 32) {
            $scope.select($scope.items[0]);
        }
    };
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="example" ng-controller="ctrl">
    <ul>
        <li ng-repeat="item in items"> 
            <a ng-click="select(item)">{{item}}</a>
        </li>
    </ul>
</div>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.