仅在未定义AngularJS时通过

Question

在我的代码中，我将一个JSON对象数组从我的服务传递到我的控制器，然后传递到我要可视化的指令。

控制器中的代码：

(function(){
'use strict';
angular.module('dashboardApp').controller('DownloadCtrl', DownloadCtrl);
DownloadCtrl.$inject= ['DownloadService','$scope'];
function DownloadCtrl(DownloadService, $scope){
    var self=this;      
    DownloadService.getRoutes()
      .then(function(responseData){       
        self.routes = responseData.data;   
  });
}
})();

HTML代码：

<div class="container" ng-controller="DownloadCtrl">    
    <donut-chart data='download.routes'></donut-chart>
</div>

指令代码：

angular.module('dashboardApp').directive('donutChart',function(){
    function link(scope,element,attr){
        var dataSet = scope.data;
        if(dataSet!==undefined){
            var chart = c3.generate({
                data: dataSet,
                type:'donut'
            });
        }
    };
    return {
        restrict: 'EA',
        link : link,
        scope: {
            data: '='       
        }
    };
});

如果I范围$watch$scope.data我注意到它出现过一次，但没有分配数据，然后它又出现了，并分配了数据。如果我没有数据集==undefiend，则代码将失败。

它适用于当前的设置，但我觉得有一种比简单地检查数据集更好的方法==未定义。我想我做事情的顺序或方式可能不正确。

我想要一种可以删除数据集的方法==undefiend

Answer 1

如果scope.data是null ，则应该从链接函数中选择return

function link(scope,element,attr){
    if(scope.data == null){
     return;
    }
    var dataSet = scope.data;
    var chart = c3.generate({
        data: dataSet,
        type:'donut'
    });
};

Answer 2

不要在链接函数中使用return，因为它阻止了添加更多业务逻辑的能力，在我看来是不可扩展的。。。

只需检查scope.data是否不是falsy值，然后执行您需要的操作。伪值为：false、0、null、undefined、''

如果对其中一个错误值执行检查，则if语句不满足。

{
  link: function postLink(scope, element, attrs) {
    if(scope.data) {
      d3.generate({
        data: scope.data
      });
    }
  }
}