Как правильно запустить JQuery DOM Manipulation из контроллера?
Поэтому я продолжаю читать, что манипуляции с jQuery из контроллера - плохая практика, но яМне не ясно, почему или как исправить.
Ниже приведен код из учебника Youtube, который даже комментирует создатель видео - плохая идея, но неНе могу объяснить, почему так и продолжает использовать плохое поведение.
Отhttps://www.youtube.com/watch?v=ilCH2Euobz0#t=553s:
$scope.delete = function() {
var id = this.todo.Id;
Todo.delete({id: id}, function() {
$('todo_' + id).fadeOut();
});
};
РЕШЕНИЕ:
По мотивам Лэнгдонаответ ниже, яя получил следующий рабочий код для моей собственной работы, который немного вытекает из приведенного выше примера кода:
var ProjectListCtrl = function ($scope, Project) {
$scope.projects = Project.query();
$scope.delete = function() {
var thisElem = this;
var thisProject = thisElem.project;
var id = thisProject.id;
Project.delete({id: id}, function() {
var idx = $scope.projects.indexOf(thisProject);
if (idx !== -1) {
thisElem.destroy('removeItem('+idx+')');
}
});
}
$scope.removeItem = function(idx) {
$scope.projects.splice(idx, 1);
}
}
app.directive('fadeOnDestroy', function() {
return function(scope, elem) {
scope.destroy = function(funcComplete) {
elem.fadeOut({
complete: function() {
scope.$apply(funcComplete)
}
});
}
}
});
Это отличается от Лэнгдонас ответом несколькими способами. Я хотел избежать добавления параметра вngClick
обратный звонок, так что яЯ храню это вthisProject
, Также пример и мой код нужно вызватьdestroy
изнутри$http
обратный вызов успеха, так что вместоthis
что больше не актуально, яm сохраненный элемент в.thisElem
ОБНОВЛЕНИЕ 2:
Далее я обновил свое решение, чтобы отразить, что funcComplete фактически не изменял исходную область $.