为什么我的response.name未定义?

时间:2016-09-23 15:45:43

标签: javascript angularjs facebook

我查看了所有相关的StackOverflow页面,似乎没有任何东西适用于我的情况。我试过console.log(响应),它只是说对象对象。我不清楚为什么在我之前获得“欢迎”时,我的应用程序上的“欢迎未定义”。

应用程序/实/ facebook.js:

HashMap

应用程序/实/ facebook.html:

'use strict';

angular.module('ngSocial.facebook', ['ngRoute', 'ngFacebook'])

.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/facebook', {
    templateUrl: 'facebook/facebook.html',
    controller: 'FacebookCtrl'
  });
}])

.config( function( $facebookProvider ) {
  $facebookProvider.setAppId('1410425285653598');
  $facebookProvider.setPermissions("email, public_profile, user_posts, publish_actions, user_photos");
})

.run(function($rootScope){
    (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk')); 
})

.controller('FacebookCtrl', ['$scope', '$facebook', function($scope, $facebook) {
    $scope.isLoggedIn = false;

    $scope.login = function(){
        $facebook.login().then(function(){
            $scope.isLoggedIn = true;
            refresh();
        });
    }


    $scope.logout = function(){
        $facebook.logout().then(function(){
            $scope.isLoggedIn = false;
            refresh();
        });
    }

    function refresh(){
        $facebook.api("/me",{fields:'last_name, first_name, email, gender, locale, link'}).then(function(response){
            $scope.welcomeMsg = "Welcome "+ response.name;
            $scope.isLoggedIn = true;
            $scope.userInfo = response;
            $facebook.api('/me/picture').then(function(response){
                $scope.picture = response.data.url;
                $facebook.api('/me/permissions').then(function(response){
                    $scope.permissions = response.data;
                    $facebook.api('/me/posts').then(function(response){
                        $scope.posts = response.data;
                    });
                });
            });
        },
        function(err){
            $scope.welcomeMsg = "Please Log In";
        });
    }

    $scope.postStatus = function(){
        var body = this.body;
        $facebook.api('/me/feed', 'post', {message: body}).then(function(response){
            $scope.msg = 'Thanks for Posting';
            refresh();
        });
    }

    refresh();
}]);

应用/ index.html中:

<div class="row" ng-controller="FacebookCtrl">
  <div class="col-md-4">
    <h4>{{welcomeMsg}}</h4>
    <div ng-if="isLoggedIn == true">
      <a href="{{userInfo.link}}" target="_blank"><img ng-src="{{picture}}"></a>
    </div>
    <br>
    <div ng-if="isLoggedIn == false">
      <button type="button" class="btn btn-default" ng-click="login()">Login</button>
    </div>
    <div ng-if="isLoggedIn == true">
      <button type="button" class="btn btn-default" ng-click="logout()">Logout</button>
    </div>
    <br><br>
    <div ng-if="isLoggedIn == true" class="well">
      <h4>User Info</h4>
      <ul>
        <li>ID: {{userInfo.id}}</li>
        <li>First Name: {{userInfo.first_name}}</li>
        <li>Last Name: {{userInfo.last_name}}</li>
        <li>Email: {{userInfo.email}}</li>
        <li>Gender: {{userInfo.gender}}</li>
        <li>Locale: {{userInfo.locale}}</li>
      </ul>
    </div>
    <br>
    <div class="well" ng-if="isLoggedIn == true">
      <h4>Permissions</h4>
      <ul>
        <li ng-repeat="permission in permissions">{{permission.permission}} - {{permission.status}}</li>
      </ul>
    </div>
  </div>
  <div class="col-md-8">
    <h3>Welcome to Facebook!</h3>
    <div ng-if="isLoggedIn == true">
      <form ng-submit="postStatus()">
      <div class="form-group">
        <label>Status Update</label>
        <textarea ng-model="body" class="form-control"></textarea>
      </div>
      <button type="submit" class="btn btn-default">Submit</button>
    </form>
    <br><br>
    <div ng-repeat="post in posts" class="stbody">
      <div class="stimg">
        <img ng-src="{{picture}}">
      </div>
      <div class="sttext">{{post.message}}<div class="sttime">{{post.updated_time}}</div>
    </div>
    </div>
  </div>
  <div ng-if="isLoggedIn == false">
    <p>You need to log in to post</p>
  </div>
</div>

2 个答案:

答案 0 :(得分:1)

你的问题是facebook.api电话中的这一行。

$scope.welcomeMsg = "Welcome "+ response.name;

如果我不得不从查看代码(不熟悉facebook api)猜测,看起来好像你要求facebook提供first_name和last_name,而不是名字。所以我怀疑你要找的代码行是

$scope.welcomeMsg = "Welcome "+ response.first_name + " " + response.last_name;

答案 1 :(得分:0)

这取决于ngFacebook API如何返回response对象,但我的钱是在data属性中。请改为response.data.name

(您还可以在控制台将其记录到任何称职的开发工具(如Chrome)后展开response对象,并手动查看其属性。)