AngularJS服务器端变量为ng-init和方法序列

时间:2014-01-14 20:37:54

标签: asp.net-mvc angularjs

我有一个“详细信息”视图和一个使用id初始化数据的控制器。

我的观点:

<div ng-app="AFApp" ng-controller="AgentCtrl" ng-init="init('@Model.Id')">

我的控制器:

$scope.id;
$scope.agent = {};

$scope.init = function (id) {
    $scope.id = id;
    getAgent();
    getAgentStatus();
    getSystemInfo();
    getActions();
};

问题是方法“getAgentStatus();”在“getAgent();”之前执行。 “getAgentStatus”需要“getAgent”提供的$ scope.agent数据。函数getAgentStatus有一个附加的计时器,它获取计时器elepses但不在init函数中的值。有人可以帮我解决角度控制器中的方法执行顺序以及如何以最佳方式提供id参数。

请参阅以下方法:

function getAgent() {
        agentDataFactory.getAgent($scope.id)
            .success(function (data) {
                $scope.agent = data;
            })
            .error(function (error) {
                console.log('Unable to load data: ' + error.message);
            });
    };

function getAgentStatus() {

        if (typeof ($scope.agent.ServiceUrl) == 'undefined' || $scope.agent.ServiceUrl == null) {
           console.log('getAgentStatus: ServiceUrl is undefined ' + JSON.stringify($scope.agent));
        }

        agentDataFactory.getAgentStatus($scope.agent.ServiceUrl)
            .success(function (data) {
                $scope.agent.CurrentStatus = data.Status;
                $scope.agent.CurrentInterval = data.Interval;
            })
            .error(function (error) {
                console.log('Unable to load data: ' + error);
            });

        $timeout(getAgentStatus, 3000);
    };

1 个答案:

答案 0 :(得分:2)

您可以将getAgentStatus()作为回调参数传递给getAgent(),并将其在success回调中执行(此时将agent定义):

function getAgent(callback) {
    agentDataFactory.getAgent($scope.id)
        .success(function (data) {
            $scope.agent = data;
            callback && callback();
        })
        .error(function (error) {
            console.log('Unable to load data: ' + error.message);
        });
};

$scope.init = function (id) {
    $scope.id = id;
    getAgent(getAgentStatus);
    getSystemInfo();
    getActions();
};

简短说明:

首先要点亮一些:

  • agentDataFactory.getAgent($scope.id).success(...).error(...);
    异步创建一个promise(将被解析)并注册两个回调,一个是成功解析promise而另一个是错误。

  • .success(function (data) { $scope.agent = data; })
    在成功解决承诺时注册回调。 (以及如果)发生时,$scope.agent将被设置。

  • function getAgentStatus() { if (typeof ($scope.agent.ServiceUrl...: 试图访问$scope.agent的某些属性,因此需要定义对象。

那么,您的代码会发生什么:

  1. getAgent()被召唤 [$ scope.agent未定义]
  2. 创建承诺 解决后将设置$scope.agent [$ scope.agent未定义]
  3. getAgent()返回并调用getAgentStatus() [$ scope.agent未定义]
  4. getAgentStatus()尝试访问$scope.agent的属性并失败 [$ scope.agent未定义]
  5. 解决了步骤2中创建的承诺,并执行了success回调 [$ scope.agent最终定义]
  6. 我的代码版本确保在解析promise之前getAgentStatus() 执行,因此定义了$ scope.agent:

    1. getAgent()被召唤 [$ scope.agent未定义]
    2. 创建承诺 解决后将设置$scope.agent [$ scope.agent未定义]
    3. getAgent()返回并调用其他函数(例如getSystemInfo()getActions()等。)。
      [$ scope.agent未定义]
    4. 解决了步骤2中创建的承诺,并执行了success回调 [$ scope.agent最终定义]
    5. 现在只有getAgentStatus()被调用,它才能正常工作,因为...
      [$ scope.agent已定义]
    6. 有关Angular承诺的更多信息,请查看 $q service