同样的事情发生在我身上，这很烦人，似乎 fb sn-p 不能很好地与 inappbroswer 配合使用，但是现在没有浪费更多时间我正在利用图形 api，因为我正在制作一个angular（还有打字稿）应用程序我已经为 Facebook 做出了一个指令，并从那里处理事件
<facebook-like url="{{vm.currentUrl}}"></facebook-like>
指令模板
<div ng-switch="vm.likeStatus">
<div ng-switch-when="like" ng-click="vm.setLike(true)">
<span class="fbLike"><img src="content/images/like.png" class="img-responsive"/></span>
</div>
<div ng-switch-when="unlike" >
<span ng-click="vm.setLike(false)">
<span class="fbLiked"><img src="content/images/liked.png" class="img-responsive" /></span>
</span>
</div>
<div ng-switch-when="loading"><img src="content/images/loader.gif" class="img-responsive" /></div>
<div ng-switch-when="login" ng-click="vm.login()">login</div>
<div ng-switch-default></div>
</div>
指令定义
namespace portal.directives {
export class facebookLike {
constructor() {
let directive: ng.IDirective = <ng.IDirective>{};
directive.restrict = 'E';
directive.scope = {
url:"@"
};
directive.templateUrl = "views/directives/facebookLike.html";
directive.controller = 'facebookLikeController';
return directive;
}
}
}
指令控制器
namespace portal.controllers {
export class facebookLikeController {
public likeStatus: string;
public postId: string;
public setLike = (value: boolean) => {
this.likeStatus = "loading";
if (value) {
this.facebookService.setLike(this.$scope.url).then((postId) => {
this.likeStatus = 'unlike';
this.postId = postId;
});
}
else {
this.facebookService.setUnlike(this.postId).then(() => {
this.likeStatus = 'like';
this.postId = void 0;
});
}
};
public login = () => {
this.userService.socialLogin(socialProviders.facebook).then(() => {
this.$state.forceReload();
});
};
static $inject = ['$element', '$scope', 'facebookService', 'userService', '$state','localStorageHandler'];
constructor(public $element: JQuery, public $scope, public facebookService: services.facebookService, public userService: services.userService, public $state, localStorageHandler) {
facebookService.isObjectLiked($scope.url).then((res) => {
this.likeStatus = res ? 'unlike' : 'like'; // if object is like then show unlike button and vice versa
this.postId = res;
}, () => {
//user is not logged in via facebook,may be via other carrier
let tokenDetails: IUser = localStorageHandler.get(storageNames.socialLoginDetails);
if (!tokenDetails)
this.likeStatus = 'login';
});
$scope.vm = this;
}
}
}
脸书服务
export class facebookService {
public fireGraphApi = (endPoint, verb): ng.IPromise<any>=> {
let config: IRequestConfig = {
method: verb,
url: "https://graph.facebook.com/v2.4/" + endPoint,
showLoader: false
}
return this.$http(config).then((res: any) => {
return res.data;
});
};
get isUserLoggedIn(): ng.IPromise<any> {
let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
if (tokenDetails && tokenDetails.social_provider == socialProviders.facebook) {
let url = "me?access_token=" + tokenDetails.access_token;
return this.fireGraphApi(url, 'GET');
}
else
return this.$q.reject();
}
public isObjectLiked = (objectUrl: string): ng.IPromise<any> => {
let def = this.$q.defer();
let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
this.isUserLoggedIn.then(() => {
//user is logged in
let url = "me/og.likes?access_token=" + tokenDetails.access_token + '&object=' + objectUrl;
this.fireGraphApi(url, 'GET').then((res) => {
if (res && res.data.length == 0) {
// not yet liked
def.resolve(void 0);
}
else {
//liked and show unlike button
def.resolve(res.data[0].id);
}
});
}, () => {
//rejected when user not logged in
def.reject();
});
return def.promise;
};
public setLike = (objectUrl: string): ng.IPromise<string> => {
return this.isUserLoggedIn.then(() => {
let url: string;
let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
url = "me/og.likes?access_token=" + tokenDetails.access_token + '&object=' + objectUrl;
return this.fireGraphApi(url, 'POST').then((res) => {
return res.id;
});
});
};
public setUnlike = (postId: string): ng.IPromise<any> => {
return this.isUserLoggedIn.then(() => {
let url: string;
let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
url = postId + "?access_token=" + tokenDetails.access_token;
return this.apiService.fireGraphApi(url, "DELETE").then((res) => {
return res;
});
});
}
static $inject = ['$http', '$q', 'localStorageHandler', 'apiService'];
constructor(public $http, public $q, public localStorageHandler: services.localStorageHandler, public apiService: services.apiService) {
}
}