かずきのBlog@hatena

すきな言語は C# + XAML の組み合わせ。Azure Functions も好き。最近は Go 言語勉強中。日本マイクロソフトで働いていますが、ここに書いていることは個人的なメモなので会社の公式見解ではありません。

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;
    });
});