代码之家 › 专栏 › 技术社区 › Kabukki

在回调中更改条件后,ngClass不更新

ng-class callback angularjs

Kabukki · 技术社区 · 7 年前

加载我这样使用:

<div class='ui segment' ng-class="{'loading': loading == true}">

为了触发调用,我使用另一个元素 ng点击

<i class='...' ng-click="action('deleteGlobal', false)"></i>

变量的 $范围

$scope.action = (action, redirect) => {
    delete $scope.error;
    $scope.loading = true;
    $timeout(() => {
        $scope.project[action]((err) => {
            $scope.loading = false;
            if (err)
                $scope.error = err;
            else if (redirect)
                $state.go('projects.all');
        });
    })
}

项目 项目经理 删除全局

deleteGlobal (callback) {
    window.setTimeout(() => {
        callback();
    }, 1000)
}

(这里,setTimeout仅用于模拟长操作,因为我计划稍后用它来替换此代码)

$范围。加载 调用回调后变为false。还有几个 安慰日志

提前感谢!

1 回复 | 直到 7 年前

Community holdenweb 4 年前

将基于回调的API与AngularJS集成

通常,在AngularJS中,基于第三方回调的API通过将其转换为$q承诺与框架集成:

function apiPromise(callbackBasedApi) {
    var defer = $q.defer()
    callbackBasedApi( (value,err) => {
         Ì¶cÌ¶aÌ¶lÌ¶lÌ¶bÌ¶aÌ¶cÌ¶kÌ¶(Ì¶)Ì¶;Ì¶  
         if (value) {
            defer.resolve(value);
         } else {
            defer.reject(err)
         }; 
    })
    return defer.promise;
}

.then 返还承诺的方式:

$scope.action = (action, redirect) => {
    delete $scope.error;
    $scope.loading = true;
    var promise = apiPromise($scope.project[action])
      .then(function(value) {
        if (redirect)
           $state.go('projects.all');
        };
    })
      .catch(function(err) {
        $scope.error = err;
    })
      .finally(function() {
        $scope.loading = false;
    });
}

承诺由 $q service 与AngularJS框架及其摘要周期集成。在AngularJS执行上下文中应用的操作将自动受益于AngularJS数据绑定、异常处理、属性监视等。

推荐文章

learner · 如果超出限制,AngularJS ui select multiple应显示警报

2 年前

Onyx · 外部和内部div都有ng click,当我单击内部div时,两个ng click都会执行。如何预防?

2 年前

Michlut · Angular JS——从表单上传文件,并作为json对象的一部分与其他数据一起发送

2 年前

jieunbi · 按日期排序数组(最新优先)

2 年前

StackoverflowNinja · 当数字框的值在AngularJS中更改时更改下拉列表的值

2 年前

Stradosphere · 如何防止ng bind html添加结束标记?

6 年前

Celestialchippy · 如果事情是真的,如何创建一个“<a>”链接?

6 年前

a4aravind · Angulari如何使用java驱动程序访问元素?

6 年前

Nicoleta Wilskon · DecodeURIComponent不支持%uxxx编码的组件

6 年前

Nishant Florentin · 在AngularJS中发生ng if、ng show等之后,我该如何做一些动作?

6 年前