您想对如何专门使用 Angular 进行 oauth 进行一些研究。输入 Google 'angular oauth' 应该是一个很好的起点。第一个结果应该是本教程。
http://devcenter.kinvey.com/angular/tutorials/how-to-implement-safe-signin-via-oauth
假设有人已经实现了 oauth 并将其作为维护模块提供是安全的。最好寻找这样的模块。
https://www.google.ie/search?site=&source=hp&ei=IPWWVOqZEePe7AbI8YH4Dg&q=angularjs+oauth+module&oq=angularjs+oauth+module&gs_l=mobile-gws-hp.12...2447.2447.0.3443.2.2.0.1.1.0.203.406.2-2.2.0.msedr...0...1c.2.60.mobile-gws-hp..1.1.88.3.KF2tzFFu2RI
编辑具体到如何使用 TypeScript 和 Angular 调用异步端点:
不要在 Angular 中使用 jQuery。如果您是 JavaScript 新手并且没有使用过 jQuery,最好不要将它与 Angular 一起使用。 jQuery 很棒。但如果你正在学习 Angular,最好不要使用它。
Angular 中的控制器和服务是原型构造函数。这些在 TypeScript 中表示为类。您在 Angular 中使用 service() 方法注册的任何类或原型构造函数都会自动注册为单例。
例子
// this is a ts module
// we put our code in here to not polute global scope
// angular modules are different -- don't confuse them
module app {
// we export the class so that we can access its API from
// tests. We don't ever want to directly new it from tests though.
// we should always use $injector.get('myService') to get the test instance.
export class MyService {
// We need to tell angular what service to inject.
// Using the $inject annotation is the cleanest way.
// Our $inject and constructor are on top of each other
// this way. We can see that they match
// As well, we use the type ng.IHttpService with on $http
static $inject = ['$http'];
constructor(private $http: ng.IHttpService) {}
getMyEndpoint() {
return this.$http.get('http://myendpoint.com/myendpoint');
}
}
// here we register this class as a singleton by using the
// .singleton method.
angular.module('app').service('myService', MyService);
}
对于控制器来说也是类似的。对于这个例子,我们将引入我们刚刚创建的单例服务。
module app {
export class MyController {
data: MyData[];
static $inject = ['myService'];
constructor(myService: MyService) {
myService.getMyEndpoint().then(
(data) => {
this.data = data;
}
);
}
}
angular.module('app').controller('MyController', MyController);
}
请注意,我们没有将 $scope 传递给控制器。相反,我们将服务调用的结果放在类的公共成员上。然后我们可以使用 controllerAs 语法在视图中访问它。这比将 $scopes 传递到控制器并绑定到它们更可取,因为它们受到范围继承的影响。它们具有与全局作用域相同的缺点。您最终会遇到范围冲突。阅读 controllerAs 语法。
你会注意到我们使用 pascal-case MyController 来注册控制器和 camel-case myServcie 来注册服务。这是为了区分当一个类注册为控制器时,每次检索它时都会返回一个它的新实例。服务是单例的。它仅由 Angular 更新一次。只返回一个实例。
因为我们导出类 API 以用于测试(但不会在测试中或我们应用程序的任何地方更新),我们希望在构建时将我们的应用程序包装在一个闭包中。 Uglifyjs 可以为我们做到这一点。
最后,谷歌“basarat angular typescript”阅读和观看来自@basarat 的许多关于 angular 和 typescript 的教程。