AngularJS 如果模型不为空，则观察模型值

Question

这里是一个简单的问题。我有这只表：

// Watch our model
$scope.$watch(function () {

    // Watch our team name
    return self.model.team.data.name;
}, function (name) {

    console.log(name);

    // if we have a name
    if (name) {

        // Store our model in the session
        sessionStorage.designer = angular.toJson(self.model);
    }
});

团队模型是作为承诺从数据库中提取的（因此是数据），所以当手表第一次触发时 self.model.team 尚未设置，所以它是无效的。我怎样才能让我的手表等到它被设置好或在手表的 return 功能中添加检查？

Answer 1

使用监视表达式而不是函数。这将捕获丢失对象和 return undefined.

的任何错误

// Watch our model
$scope.$watch('self.model.team.data.name', function (name) {

    console.log(name);

    // if we have a name
    if (name) {

        // Store our model in the session
        sessionStorage.designer = angular.toJson(self.model);
    }
});

Answer 2

这里没有魔法 - 如果您访问的变量之一可能是 null/undefined，那么如果它是 null，您将无法获得它的属性 /undefined。所以，你要防范于未然：

$scope.$watch(
  function(){
    return (self.model.team && self.model.team.data.name) || undefined;
  }, 
  function(v){
    // ...
  });

唯一的 "magic" 是当您“$watch”表达式时，但表达式需要暴露在作用域中。所以，你可以这样做：

$scope.model = self.model;
$scope.$watch("model.team.data.name", function(v){
  // ...
});

但是，实际上，您必须问问自己为什么需要 $watch 开始。在我看来，您正在异步获取 team 一次 - 它看起来不会改变，除非可能是另一个异步调用。因此，当您收到没有 $watch:

的数据时，只需处理一下

someSvc.getTeam() // I made an assumption about a service that pulls the data from db
  .then(function(team){
     var name = team.data.name;

     // if we have a name
     if (name) {
        // Store our model in the session
        sessionStorage.designer = angular.toJson(self.model);
     }
  });

不必要的 $watch 是昂贵的 - 它在每个摘要周期都被评估，所以最好减少 $watchers 的数量。

AngularJS 如果模型不为空，则观察模型值

AngularJS watch model value if model is not null

angularjs

angularjs-watch