javascript - 正确检索用户名和有用的值(网站标题，版权等)

我有一个基于此项目（https://github.com/arthurkao/angular-drywall）的简单Web应用程序，它以NodeJS和AngularJS作为前端运行。

我正在尝试建立一个简单的页面，以显示地图上所有已连接用户的列表（使用Google Maps，Geolocation和PubNub）。

这是我实际上的操作方式：

angular.module('base').controller('TravelCtrl',
  function($rootScope, $scope, NgMap, security, $geolocation, PubNub){

    $rootScope.extusers = []; //remote users

    $scope.initTravel = function() { //declare the init function

      PubNub.init({
        subscribe_key: $rootScope.security.keys.psk,
        publish_key: $rootScope.security.keys.ppk,
        uuid: $rootScope.security.currentUser.username,
        ssl: true
      });

      PubNub.ngSubscribe({
        channel: "travel",
        state: {
          position: {},
        }
      });

      console.log("Loaded Travel");

      $geolocation.getCurrentPosition({
        timeout: 60000
      }).then(function(position) { //when location is retreived

        $scope.position = position;

        PubNub.ngSubscribe({
          channel: "travel",
          state: {
            position: {
              lat: Math.floor($scope.position.coords.latitude*1000)/1000, //decrease accuracy
              long: Math.floor($scope.position.coords.longitude*1000)/1000,
            },
          }
        });

        $rootScope.$on(PubNub.ngPrsEv("travel"), function(event, payload) {
          $scope.$apply(function() {
            $scope.extusers = PubNub.ngPresenceData("travel");
          });
        });

        PubNub.ngHereNow({ channel: "travel" });

        $scope.showInfo = function(evt, marker) { //show user window on map

          $scope.extuser = marker;

          $scope.showInfoWindow('infoWindow');

        };
      });
    };

    if ($rootScope.hasLoaded()) { //if username and keys are already loaded, then init module
      $scope.initTravel();
    } else { //else, wait for username and keys to be loaded
      $rootScope.$on('info-loaded', function(event, args) {
        $scope.initTravel();
      });
    }

  }
);

尽管它可以工作，但似乎有很多bug，有时仅加载。有时，我得到以下信息：

Result screenshot

我真的不知道自己在做什么错，因为我只是遵循PubNub的AngularJS SDK上的教程。

我认为这与初始化应用程序有关。

angular.module('app').run(['$location', '$rootScope', 'security', function($location, $rootScope, security) {
    // Get the current user when the application starts
    // (in case they are still logged in from a previous session)
    $rootScope.hasLoaded = function() {
      return (security.keys && security.info && security.currentUser); //check if everything is loaded correctly
    };

    $rootScope.checkLoading = function() {
      if ($rootScope.hasLoaded()) {
        $rootScope.$broadcast('info-loaded'); //broadcast event to "TravelCtrl" in order to init the module
      }
    };

    security.requestKeys().then($rootScope.checkLoading); //request secret keys

    security.requestSiteInfo().then($rootScope.checkLoading); //then templating info (site title, copyright, etc.)

    security.requestCurrentUser().then($rootScope.checkLoading); //and finally, current user (name, id, etc.)

    $rootScope.security = security;

    // add a listener to $routeChangeSuccess
    $rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
      $rootScope.title = current.$$route && current.$$route.title? current.$$route.title: 'Default title';
    });
}]);

1-使用JSON API请求密钥，站点信息和当前用户。

2-等待所有内容加载完毕，然后使用适当的键（PubNub，Google Maps）初始化应用程序

-
我的问题是：
通过RESTful API检索有用信息后，如何实例化AngularJS应用程序？

我对AngularJS还是很陌生，如果我的方法是完全荒谬的，我也不会感到惊讶，但是我确实需要获得一些建议。

在此先感谢您的帮助，

尤利西斯

最佳答案

您不必等待AJAX​​查询结束就可以启动角度APP。
您可以使用$ http promise（details her）

在控制器中：

// Simple GET request example:
$http({
  method: 'GET',
  url: '/someUrl'
}).then(function successCallback(response) {
    // this callback will be called asynchronously
    // when the response is available

    // data is now accessible in the html
    $scope.data = response ;
    // you can call a function to add markers on your maps with the received data
    addMarkerOnMap(response);
}, function errorCallback(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});

您还可以在某些变量上添加监视以等待对其进行修改：

// you should have $scope.yourVarName declared.
$scope.$watch('yourVarName', function(newValue, oldValue) {
  console.log(newValue);
});

或观看列表/对象

$scope.$watchCollection('[var1,var2]', function () {

},true);