仅在未定义的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: '='       

        }
    };
});

如果我范围.$ $scope.data，我注意到它只出现一次，并且没有分配数据，然后它再次出现，并分配给它的数据。如果我没有dataSet!==undefiend，那么代码就会失败。

它适用于当前的设置，但我认为有一种比简单地检查dataSet!==undefined.是否更好的方法我想我可能会以不正确的顺序或不正确的方式做事情。

我想要一种允许我删除dataSet!==undefiend的方法

Answer 1

如果return是null，则应该从链接函数中提取null。

function link(scope,element,attr){
    if(scope.data == null){
     return;
    }

    var dataSet = scope.data;

    var chart = c3.generate({
        data: dataSet,
        type:'donut'
    });

};

Answer 2

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

只需检查scope.data是否是一个虚假的值，然后做您所需要的。Falsy值为：false、0、null、undefined、''

如果您对这些虚假值之一执行检查，则if语句将无法满足。

​

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

​