From a5f133ec4f2c8d76e0c9cf9ab107b07b0ba780e7 Mon Sep 17 00:00:00 2001 From: John Emau Date: Mon, 18 Nov 2013 14:41:44 -0800 Subject: [PATCH 1/2] updating angular readme with new example of using angular resource definitions Conflicts: angularjs/README.md --- angularjs/README.md | 85 +++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 78 insertions(+), 7 deletions(-) diff --git a/angularjs/README.md b/angularjs/README.md index 806a605d5..5b5ed54dd 100644 --- a/angularjs/README.md +++ b/angularjs/README.md @@ -1,4 +1,4 @@ -# AngularJS Definitions Usage Notes +# AngularJS Definitions Usage Notes ## Referencing AngularJS definition files in your code @@ -8,18 +8,20 @@ That will make available to your code all interfaces AngularJS' main module **ng If you are including other AngularJS' modules in your code, like **ngResource**, just like you needed to include the additional module implementation file in your code, _angular-resource.js_, you will also need to reference the definitions file related to that module. Your code would then have the following definitions files reference: - /// - /// + /// + /// Having these modules in separated files is actually good because they sometimes either augment or modify some of **ng**'s interfaces, and thus those differences should only be available to you when you really need them. Also, it forces you to explicit what you're going to be using. The following extra definition files are available for referencing: -* angular-resource-1.0.d.ts (for the **ngResource** module) -* angular-cookies-1.0.d.ts (for the **ngCookies** module) -* angular-sanitize-1.0.d.ts (for the **ngSanitize** module) -* angular-mocks-1.0.d.ts (for the **ngMock** and **ngMockE2E** modules) +* angular-resource.d.ts (for the **ngResource** module) +* angular-route.d.ts (for the **ngRoute** module) +* angular-cookies.d.ts (for the **ngCookies** module) +* angular-sanitize.d.ts (for the **ngSanitize** module) +* angular-mocks.d.ts (for the **ngMock** and **ngMockE2E** modules) +(postfix with version number for specific verion, eg. angular-resource-1.0.d.ts) ## The Angular Static @@ -101,6 +103,75 @@ Since you are augmenting the $scope object, you should let the compiler know wha ### Working with $resource + /// + /// + + // We have the option to define arguments for a custom resource + interface IArticleParameters { + id: number; + } + + // Let's define a custom resource + interface IArticleResourceClass extends ng.resource.IResourceClass { + // Overload get to accept our custom parameters + get(): ng.resource.IResource; + get(params: IArticleParameters, onSuccess: Function): IArticleResource; + + // Add our custom resource actions + publish(): IArticleResource; + publish(params: IArticleParameters): IArticleResource; + unpublish(params: IArticleParameters): IArticleResource; + } + + interface IArticleResource extends ng.resource.IResource { + title: string; + text: string; + date: Date; + author: number; + + // Although all actions defined on IArticleResourceClass are avaiable with + // the '$' prefix, we have the choice to expose only what we will use + $publish(): IArticleResource; + $unpublish(): IArticleResource; + } + + function MainController($resource: ng.resource.IResourceService) { + + // IntelliSense will provide IActionDescriptor interface and will validate + // your assignment against it + var publishDescriptor: ng.resource.IActionDescriptor; + publishDescriptor = { + method: 'GET', + isArray: false + }; + + // I could still create a descriptor without the interface... + var unpublishDescriptor = { + method: 'POST' + } + + // A call to the $resource service returns a IResourceClass. Since + // our own IArticleResourceClass defines 2 more actions, we cast the return + // value to make the compiler aware of that + var articleResource = $resource('/articles/:id', null, { + publish : publishDescriptor, + unpublish : unpublishDescriptor + }); + + // Now we can do this + articleResource.unpublish({ id: 1 }); + + // IResourceClass.get() will be automatically available here + var article: IArticleResource = articleResource.get({id: 1}, function success() { + // Again, default + custom action here... + article.title = 'New Title'; + article.$save(); + article.$publish(); + }); + } + +### Working with $resource in angular-1.0 definitions + /// /// From 10603d7cec2cd70587cb693a79ff7a981d208e88 Mon Sep 17 00:00:00 2001 From: John Emau Date: Mon, 18 Nov 2013 15:39:15 -0800 Subject: [PATCH 2/2] fix readme clean up missed in merge --- angularjs/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/angularjs/README.md b/angularjs/README.md index 5b5ed54dd..9cf668559 100644 --- a/angularjs/README.md +++ b/angularjs/README.md @@ -2,7 +2,7 @@ ## Referencing AngularJS definition files in your code -To do that, simply add `/// ` at the top of your code. +To do that, simply add `/// ` at the top of your code. That will make available to your code all interfaces AngularJS' main module **ng** implements, as well as the **AUTO** module.