link 函数中的 $watch 在 factory/service 值上未更新

Question

下面是我正在使用的指令，我试图根据工厂中的变量更新 template URL：

.directive('poGenericNotification',['errorHandler', function(errorHandler) {
return {
  controller: 'ErmModalCtrl',
  restrict: 'EA',
  scope: {
    title: '=',
    errorList: '=',
    errMsg: '=',
    error: '=',
    info: '=',
    numNotifications: '=',
    messageOverflow: '='
  },
  template: "<div ng-include='getTemplateUrl()' class='generic-notif-container' ng-click='openErm()'></div>",
  transclude: true,
  link: function(scope) {
    scope.$watch(errorHandler.getMostRecentError(), function(mostRecentError) {
      scope.getTemplateUrl = function() {
        if (mostRecentError.type === "Alert") {
          return 'src/alerts/templates/error-alert.html';
        }
        else if (mostRecentError.type === "Info") {
          return 'src/alerts/templates/info-alert.html';
        }
      }
    }, true);
    }
  }
}])

这是它引用的工厂：

.factory('errorHandler', function () {
var errorArray = [];
var mostRecentError = {
  type:'', message: '', timestamp: ''
};
function compareObjs(a,b) {
   //sorting function
}
errorArray.addError = (function (type, message) {
  var timestamp = Date.now();
  errorArray.push({type: type, message: message, timestamp: timestamp});
  errorArray.sort(compareObjs);
  errorArray.generateMostRecentError();
});
//....some functions
errorArray.generateMostRecentError = function() {
  if (errorArray[0].message.length > 138) {
    mostRecentError.message = errorArray[0].message.slice(0, 138) + "...";
    messageOverflow = true;
  } else {
    mostRecentError.message = errorArray[0].message;
    messageOverflow = false;
  }
  mostRecentError.type = errorArray[0].type;
  mostRecentError.timestamp = errorArray[0].timestamp;
  console.log(mostRecentError);
}
errorArray.getMostRecentError = function() {
  console.log(mostRecentError);
  return mostRecentError;
}
return errorArray;
})

我希望能够 add/remove 来自其他控制器的错误并让它更新指令。目前，$watch mostRecentError 回调的初始值是 undefined，然后它永远不会更新。我错过了什么？

Answer 1

要在每个摘要循环中调用该函数，您应该替换

errorHandler.getMostRecentError()

来自

errorHandler.getMostRecentError

否则，您会将函数调用的结果作为附加到指令范围的变量来观察。

Answer 2

您需要将函数传递给 $watch 而不是其结果。更改为：

scope.$watch(errorHandler.getMostRecentError, ...);

link 函数中的 $watch 在 factory/service 值上未更新

$watch in a link function on a factory/service value is not updated

watch

angularjs

angularjs-directive