かずきのBlog@hatena

日本マイクロソフトに勤めています。XAML + C#の組み合わせをメインに、たまにASP.NETやJavaなどの.NET系以外のことも書いています。掲載内容は個人の見解であり、所属する企業を代表するものではありません。

TypeScript + AngularJS「リソースを使う」

結構めんどくさい。とりあえず動いたのでメモ。

  • ng.resource.IResourceを継承したものを作る
  • プロパティを生やす
  • IResourceServiceからIResourceClassを作る
  • IResourceClassのgetの戻り値を自作のIResourceを継承したものにキャスト
  • あとは好きにする
/// <reference path="scripts/typings/angularjs/angular.d.ts" />
/// <reference path="scripts/typings/angularjs/angular-resource.d.ts" />

var m = angular.module("sampleApp", ["ngResource"]);

interface AppScope extends ng.IScope {
    message: string;
}

class Person {
    constructor(
        public id: number = null,
        public name: string = null) {
    }
}

interface PersonResource extends ng.resource.IResource<Person> {
    name: string;
}

m.controller("AppCtrl", ($scope: AppScope, $resource: ng.resource.IResourceService) => {
    var p = $resource("/api/Person/:id", { id: "@id" });

    var user = <PersonResource>p.get({ id: 10 }, () => {
        $scope.message = user.name;
    });
});