绑定到未定义的值时警告我

时间:2017-12-05 18:00:33

标签: angularjs

在定义与console.warn的角度绑定时,是否有undefined我的devmode设置?

这有助于在开发过程中捕获拼写错误和API更改,然后可以在生产中关闭。

示例:

JS:

$scope.user = {firstName:'Sam', lastName:null};

HTML

First: <input ng-model="user.first_name"/> <!-- broken -->
Last: <input ng-model="user.lastName"/> <!-- good -->

理想情况下,Angular可以通知user.first_name解析为undefined并提醒我,而user.lastName解析为null,所以没问题。

1 个答案:

答案 0 :(得分:1)

我认为你可以在Proxy的帮助下完成它。我只展示了起点示例。因此,您可以在构造函数中使用“proxy”逻辑创建基本控制器(并仅在开发阶段应用它),然后从其继承所有其他控制器:

angular.module('app', []).controller('ctrl', function($scope) {
  var handler = (function() {
    var arrUndef = [];
    return {
      get: function(target, name) {
        if (
          target[name] === undefined 
          &&
          arrUndef.indexOf(name) == -1 
          && 
          ['document', 'children', 'and other'].indexOf(name) == -1
        ) {
          arrUndef.push(name);
          console.log(`Warning: ${name} is undefined!`);
        }
        return target[name];
      }
    };
  })();
  $scope.__proto__ = new Proxy($scope.__proto__, handler);

  $scope.existed = 33;
  $scope.anotherexisted = 55;
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js">
</script>

<div ng-app='app' ng-controller='ctrl'>
  <input type='text' ng-model='existed' />
  <input type='text' ng-model='absent' />
  <p>{{notexisted}}</p>
  <p>{{anotherexisted}}</p>
</div>