Angular指令回调解析with promise

时间:2015-07-22 19:03:45

标签: javascript angularjs

我想知道如何才能最好地解决这个问题。在下面的代码中,我有一个具有回调函数的指令。在这个指令中,将对传入的变量进行相同的更改,并且当调用指令中的按钮时,我想触发回调。在控制器的回调函数中,我将执行HTTP POST以在数据库中存储内容。

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $q, $timeout) {
  $scope.ctrlCallback = function() {
    var deferred = $q.defer();

    $timeout(function(){
      deferred.resolve();
    }, 1500);

    return deferred.promise;
  }
});

app.directive('myDirective', function($compile) {
  return {
    restrict: 'E',
    scope: {
      callback: '&'
    },
    template: '<div><button ng-click="save()">save</button></div>',
    link: function(scope, elem, attr, ctrl) {
      scope.save = function() {
        var promise = scope.callback();

        if(!promise) {
          return
        }

        promise.then(function(result){
          alert('success, keep/do the changes');
        },
        function(error) {
          alert('not successful, undo the changes');
        })
      }
    }
  };
});

HTML:

<body ng-controller="MainCtrl">
  <my-directive callback="ctrlCallback()"></my-directive>
</body>

此刻我从父控制器返回一个promise,以便我可以在指令中捕获结果。也可以返回void,然后假设一切都很顺利。但是我觉得这可以解决得更好一些。以前有没有人处理过这样的事情?

http://plnkr.co/edit/VdyFm4YRHQt7w2jMVnj6?p=preview

0 个答案:

没有答案