Angular-控制器在使用ng单击后刷新

Angular - Controller refresh after using ng-click

本文关键字：单击 刷新 ng 控制器 Angular-      更新时间：2023-09-26

我有一个控制器，它基本上是一个对象，在这个对象内部我有函数。

一开始，我设置了变量的默认值，并使用init()函数从数据库中获取数据。

除了一件事外，整个页面都能正常工作。不知怎的，当我使用ng点击从所选中删除时，我遇到了麻烦

  <a href="#" ng-click="listCtrl.removeFromChosen(chosen)" class="tagselect__close">
     <span class="glyphicon glyphicon-remove remove-icon" aria-hidden="true"></span>
  </a>

我的整个控制器再次初始化，所以它将所有值设置为默认值，并再次调用init()函数。我不明白为什么会发生这种事。

"use strict";
myApp.controller('ListCtrl', ['$scope', '$cookies', '$http', function ($scope, $cookies, $http) {
    var listCtrl = {
        candidate: {},
        candidates: [],
        positions: [],
        chosenPositions: [],
        init: function () {
            listCtrl.getCandidates();
            listCtrl.getPositions();
        },
        getCandidates: function () {
            $http.get('api/v1/candidates/getCandidates.php').then(function (res) {
                listCtrl.candidates = res.data;
            });
        },
        getPositions: function () {
            $http.get('api/v1/positions/getPositions.php').then(function (res) {
                listCtrl.positions = res.data;
            });
        },
        removeFromChosen: function (position) {
            var index = listCtrl.getChosenIndex(position);
            listCtrl.chosenPositions.splice(index, 1);
            //console.log(listCtrl.chosenPositions);
        },
    };
    listCtrl.init();
    $scope.listCtrl = listCtrl;
}]);

知道我做错了什么吗？

使用锚点标记执行单击功能时，即使它没有链接到任何内容，默认情况下也会刷新页面。为了防止这种情况，请将事件对象传递给您正在调用的函数，并使用类似的防止默认值：

removeFromChosen: function (event, position) {
        event.preventDefault();
        var index = listCtrl.getChosenIndex(position);
        listCtrl.chosenPositions.splice(index, 1);
        //console.log(listCtrl.chosenPositions);
    }

删除与ng-click不兼容的href="#"。

相关文章：