定義されていない値にバインドするときに警告する

Question

undefinedに角度バインディングを定義するとき、devmodeをconsole.warnに設定していますか？

これは、開発中に誤植やAPIの変更を検出するのに役立ち、本番環境では無効にすることができます。

例：

JS：

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

HTML

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

理想的にはそう、角度がuser.first_nameがundefinedに解決されることを通知することもできますし、user.lastNameがnullに解決しながら、私に警告大丈夫です。

Answer 1

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>