Angular Directive捕获ng-model的初始空值

时间:2016-02-25 12:07:30

标签: angularjs angularjs-directive

我正在使用自定义指令并尝试捕获$ scope.model,如果它具有初始值,我想处理该数据等。

我的初始代码是:

if ($scope.model && $scope.model.length > 0) {
  var id = angular.isArray($scope.model) ? $scope.model.join(',')
    : $scope.model;

  if (id)
    initialJobs.push(
      $http.get(config.root.api + 'sectors?id=' + id)
    );
}

因为$ scope.model为null,所以此if语句不会被处理。 (我已经放了一个console.log,看到$ scope.model为null)。

如果我的超时时间为1000毫秒,我会捕获$ scope.model的实际数据。

PS:$ scope.model数据是通过控制器中的HTTP请求收集的,由于双向绑定,它首先被发送到视图为null,当数据形成时,模型值会发生变化。

感谢您阅读:)

PS:我知道解决这个问题的一个解决方案是解决路由器层中的异步请求,然后将其传递给控制器​​,这样双向绑定就不会有任何延迟。但我认为这对于这个问题来说是一个不好的做法。

2 个答案:

答案 0 :(得分:2)

您可以将观察者添加到该值。

$scope.$watch('model', function(model, oldModelValue) {
    var id = angular.isArray(model) ? model.join(',') : model;

    if (id)
        initialJobs.push($http.get(config.root.api + 'sectors?id=' + id));
});

你必须要小心,每当$scope.model被更改时,watcher就会调用回调,即使它是null或任何其他意外值。

至于另一个更好的解决方案,你可以设置$ http call的返回值(这是一个promise),你可以将$ scope.model设置为类似于$scope.modelPromise的值,你可以{{ 1}}那个承诺。

then

我建议使用$ resource服务,如果这不是一个过度的话。

答案 1 :(得分:1)

看起来您正在处理指令中的数据。在我看来,这是一个坏主意。您声明问题可以通过在路由器中使用“resolve”来解决,但您认为这是不好的做法。它会解决你的问题,它是一个比你现在更好的解决方案。 或者,您可以从控制器执行XHR调用。在promise.then的第一个你可以做第二个电话。在承诺的'then'回调中,更新您的模型。根据你的模型,MVVM,问题解决你的观点。