Javascript 降低代码复杂性以提高可读性并使条件逻辑工作

我正在尝试减少控制器中的代码重复，我已经在浏览器和设备上模拟了控制器以进行测试。核心功能目前可以工作，但目前它违反了DRY原则。我试图添加以下功能，这些功能规定了主屏幕上应该显示的内容，但它似乎根本不起作用：

1） 空状态-当$scope.facebookUserData和$scope.facebookUserPicture为空时显示

2） showFacebookEmptyState-当$scope.facebookUserData和$scope.facebookUserPicture不为null，但$scope.userPicture、$scope.userProfile或$scope.userSelectedCategories中的任何一个为null时出现

3） showDefaultState—当所有$scope.userPicture、$scope.userProfile或$scope.userSelectedCategories均不为空时，无论是否存在其他内容，都会显示此状态

有人对如何重构下面的代码并使其更易于阅读有想法吗？我有点不知所措的混乱，我正在努力寻找另一种方法

home.view.html

你应该用你应该用的

<div class="empty-state" ng-show="showEmptyState">
  <img class="icon icon-home" src="img/user.svg">
  <div class="heading heading-padding">Set up your profile</div>
  <div class="subheading heading-padding">You will need to set up a profile before creating a resume. This will help us learn more about you
    <br><br>
    <button class="button button-balanced button-block remove-border-radius">Get Started</button>
  </div>
</div>

<div class="facebook-empty-state" ng-show="showFacebookEmptyState">
  <img class="icon icon-home img-circle" ng-src="{{ facebookUserPicture.data.base64_data }}">
  <div class="heading heading-padding">Welcome, {{ facebookUserData.first_name}}</div>
  <div class="subheading heading-padding">You will need to set up a profile before creating a resume. This will help us learn more about you.
    <br><br>
    <button class="button button-balanced button-block remove-border-radius" ui-sref="tab.setup-profile-facebook">Get Started</button>
</div>

<div class="default-state" ng-show="showDefaultState">
  You have signed up and are ready to go
</div>

/*
*
*/
(function() {
  'use strict';

  angular
  .module('dingocv.controllers')
  .controller('HomeController', HomeController)


  function HomeController($scope, config, $cordovaNativeStorage, FacebookService, $ionicLoading, PhotoService, $log) {

    // On device
    if (window.cordova) {

      // Get Facebook access token
      $cordovaNativeStorage.getItem("facebookAccessToken").then(function (value) {
        $scope.facebookAccessToken = value

        // Get Facebook user data
        FacebookService.getUserData($scope.facebookAccessToken).then(function(dataResponse) {
          $scope.facebookUserData = dataResponse.data;

          // Save Facebook user data
          $cordovaNativeStorage.setItem("facebookUserData", $scope.facebookUserData).then(function () {
          }, function(error) {
            console.error("Unable to cache user data: " + result);
            $ionicLoading.show({
              template: 'Unable to cache user data',
              duration: 1500
            })
          });
          $scope.showFacebookEmptyState = true;
          $scope.showEmptyState = false;
          $scope.showDefaultState = false;

          // Get Facebook user picture
          FacebookService.getUserPicture($scope.facebookUserData.id).then(function(dataResponse) {
            $scope.facebookUserPicture = dataResponse.data;
            PhotoService.getBase64FromImageURL($scope.facebookUserPicture.data.url, function(base64_data) {
              $scope.facebookUserPicture.data.base64_data = base64_data;

              // Save Facebook user picture
              $cordovaNativeStorage.setItem("facebookUserPicture", $scope.facebookUserPicture).then(function () {
              }, function(error) {
                console.error("Unable to cache user data: " + result);
                $ionicLoading.show({
                  template: 'Unable to cache user data',
                  duration: 1500
                })
              })
            });
          }, function(error) {
            $scope.showFacebookEmptyState = false;
            $scope.showEmptyState = true;
            $scope.showDefaultState = false;
            console.log(error.data.error.message)
          })
        }, function(error) {
          $scope.showFacebookEmptyState = false;
          $scope.showEmptyState = true;
          $scope.showDefaultState = false;
          console.log(error.data.error.message)
        })
      }, function (error) {
        $scope.showFacebookEmptyState = false;
        $scope.showEmptyState = true;
        $scope.showDefaultState = false;
        console.log(error)
      });
    }


    // On browser

    else {
      // Get Facebook user data
      FacebookService.getUserData(config.facebookAccessToken).then(function(dataResponse) {
        $scope.facebookUserData = dataResponse.data;

        // Save Facebook user data
        $cordovaNativeStorage.setItem("facebookUserData", $scope.facebookUserData).then(function () {
        }, function(error) {
          console.error("Unable to cache user data: " + result);
          $ionicLoading.show({
            template: 'Unable to cache user data',
            duration: 1500
          })
        });
        $scope.showFacebookEmptyState = true;
        $scope.showEmptyState = false;
        $scope.showDefaultState = false;
      }, function(error) {
        $scope.showFacebookEmptyState = false;
        $scope.showEmptyState = true;
        $scope.showDefaultState = false;
        console.log(error.data.error.message)
      })

      // Get Facebook user picture
      FacebookService.getUserPicture(config.facebookUserId).then(function(dataResponse) {
        $scope.facebookUserPicture = dataResponse.data;
        PhotoService.getBase64FromImageURL($scope.facebookUserPicture.data.url, function(base64_data) {
          $scope.facebookUserPicture.data.base64_data = base64_data;

          // Save Facebook user picture
          $cordovaNativeStorage.setItem("facebookUserPicture", $scope.facebookUserPicture).then(function () {
          }, function(error) {
            console.error("Unable to cache user data: " + result);
            $ionicLoading.show({
              template: 'Unable to cache user data',
              duration: 1500
            })
          });
          $scope.showFacebookEmptyState = true;
          $scope.showEmptyState = false;
          $scope.showDefaultState = false;
        }, function(error) {
          $scope.showFacebookEmptyState = false;
          $scope.showEmptyState = true;
          $scope.showDefaultState = false;
          console.log(error.data.error.message)
        })
      });
    }

    // Determine view state
    $cordovaNativeStorage.getItem("userPicture").then(function (value) {
        $scope.userPicture = value;
    }, function (error) {
        //$log.log(error);
    });
    $cordovaNativeStorage.getItem("userProfile").then(function (value) {
      $scope.userProfile = value;
    }, function (error) {
        //$log.log(error);
    });
    $cordovaNativeStorage.getItem("userSelectedCategories").then(function (value) {
      $scope.userSelectedCategories = value;
    }, function (error) {
        //$log.log(error);
    });
  }
})();