Upgrade to Pro — share decks privately, control downloads, hide ads and more …

TypeScriptで書くAngularJS @ GDG神戸2014.8.23

TypeScriptで書くAngularJS @ GDG神戸2014.8.23

2014年8月23日発表分の資料をSlideShareより再掲。
http://www.slideshare.net/armorik83/gdgkobe-angularjs-2

2bedb1eb8f841cd3c3ae584600b016e0?s=128

OKUNOKENTARO

August 23, 2014
Tweet

Transcript

  1. 5ZQF4DSJQUד剅ֻ "OHVMBS+4 "OHVMBS+4⹈䓼⠓CZ(%(牞䨫 

  2. "OHVMBS+4ךְְהֿ׹ ˖ غ؎ٝسָ知⽃
 Ꟛ涪⚥חٌثك٦ءّٝ♳ָ׷ ˖ 3&45GVM"1*⵸䲿ךؿٖ٦يٙ٦ؙ ˖ ط؎ذ؍ـ،فٔה麩ְ
 ⦐➂ⵃ欽ךءأذي׾؟ؙ׏ה⡲׸׷ !BSNPSJL

  3. 植㖈ך圓䧭 /PEFKT &YQSFTT .POHP%# "OHVMBS+4 Database RESTful API Controller HTML

    #SPXTFS JSON
  4. ְ׻ײ׷.&"/أةحؙ ˖ ..POHP%# ˖ &&YQSFTT ˖ ""OHVMBS+4 ˖ //PEFKT Ⰻ鿇+BWB4DSJQU

  5. Ⰻ鿇+BWB4DSJQU ׍׳׏הخٓ؎

  6. http://www.typescriptlang.org/

  7. ،ٝ؛٦ز 兛媮5ZQF4DSJQU׾ 剅ְג׷הְֲ倯

  8. ת׌ך倯 כׄ׭ת׃׳ֲ

  9. 5ZQF4DSJQUהכ ˖ BMU+4הְ׻׸׷鎉铂ךמהא ˖ .JDSPTPGU爡ָ䎃ַ׵Ꟛ涪
 חWָ⳿׋ ˖ +BWB4DSJQUך♳⡘✼䳔鎉铂
 㢌䳔䖓ך+4ا٦أ׮铣׫װְׅ ˖

    ꫼涸㘗➰ֽ ˖ $ח䢪׸גְ׋׵Ⰵ׶װְׅ
  10. ז׈5ZQF4DSJQU ˖ 傀㶷ך+BWB4DSJQU项欵ծⰋג⢪ִ׷ ˖ 㢌䳔䖓ך+4ا٦أָ铣׫װְׅ ˖ ꫼涸㘗➰ֽBMU+4ד䝢׬ז׵ծֿ׸ָ♧殢ךⵃ挿 ˖ "OHVMBS+4׾⹛ַׅהـٓؐؠ♳ךرغحؚ ָ㢳涪̔㢌䳔䖓ךا٦أ׾铣׬堣⠓ָ㢳ְ

  11. ˖ 葿ղ⡲׶㨣׭׷הծ"OHVMBS+4׌ֽד׮
 㣐鋉垷חז׶ָ׍ ˖ /PEFKT .POHP%#׮⢘欽ׅ׷ה
 +40/װ0CKFDUך䪔ְָ걼涪 ˖ ꫼涸㘗➰ָֽ⸬ֻ ז׈5ZQF4DSJQU

  12. ˖ ؙٓأك٦أזؔـآؙؑز䭷ぢ鎉铂 ˖ Class.prototype.method = function(){…
 ꬗⦜זQSPUPUZQF׾剅ֻ䗳銲כ֮׶תׇ׿ ˖ ٗآحؙכⱄⵃ欽ך׋׭ؙٓأחתה׭׷ ˖

    5ZQPכ؝ٝػ؎ָٓⰋ⸂ד䭷䶯 ˖ ؝ٝػ؎ٕؒٓ٦ָ⳿׋׵וֶַַֿ׃ְ ז׈5ZQF4DSJQU
  13. 5ZQF4DSJQU⢪ֲה 䠬⹛ׅ׷״

  14. 5ZQF4DSJQU ؟ٝفٕ 5ZQF4DSJQUⰕ䒭״׶䒷欽

  15. class Greeter { private greeting: string; constructor(message: string) { this.greeting

    = message; } public greet() { return 'Hello, ' + this.greeting; } } ! var greeter = new Greeter('world'); ! var button = document.createElement('button'); button.textContent = 'Say Hello'; button.onclick = () => { alert(greeter.greet()); }; ! document.body.appendChild(button); TS
  16. var Greeter = (function () { function Greeter(message) { this.greeting

    = message; } Greeter.prototype.greet = function () { return 'Hello, ' + this.greeting; }; return Greeter; })(); ! var greeter = new Greeter('world'); ! var button = document.createElement('button'); button.textContent = 'Say Hello'; button.onclick = function () { alert(greeter.greet()); }; document.body.appendChild(button); //# sourceMappingURL=greeter.js.map JS
  17. class Greeter { private greeting: string; constructor(message: string) { this.greeting

    = message; } public greet() { return 'Hello, ' + this.greeting; } } ! var greeter = new Greeter('world'); ! var button = document.createElement('button'); button.textContent = 'Say Hello'; button.onclick = () => { alert(greeter.greet()); }; ! document.body.appendChild(button); TS
  18. class Greeter { private greeting: string; constructor(message: string) { this.greeting

    = message; } public greet() { return 'Hello, ' + this.greeting; } } ! var greeter = new Greeter('world'); ! var button = document.createElement('button'); button.textContent = 'Say Hello'; button.onclick = () => { alert(greeter.greet()); }; ! document.body.appendChild(button); ̒䒷侧ך㘗 ،ؙإأ⥜귅㶨̓ OFX דㄎל׸׷̓ ֿך鴟כ֮ת׶㢌׻׵זְ ̓،ٗ٦ꟼ侧䒭&4⯓《׶ TS
  19. ׉ך➭ך暴䗙 ˖ 㘗䱿锷֮׶תׅ ˖ var foo = 'abc';
 var foo:

    string = 'abc';ה剅ַזֻג׮ְְ ˖ JOUFSGBDFד㹋鄲ךזְ㘗ך׫ך㹀纏 ˖ NPEVMFדせ⵸瑞꟦涸ז⢪ְ倯
 ֿֿדְֲNPEVMFכ$PNNPO+4הכ殯ז׷ ˖ آؑطؙٔأծ竰䪫ծזוזו
  20. ˖ ׻ַ׭תׁמ׹孑
 ջ5ZQF4DSJQUٔؿ؋ٖٝأ
 խ7FS㼎䘔ռ ˖ 俑岀׌ֽדזֻծꟚ涪橆㞮ך圓眠ַ׵
 佄䴂خ٦ٕHSVOU CPXFS UTEזוך
 鍑铡׮䲓鯹

    ˖ +BWB4DSJQU㛇燉濼陎׮鯹׏גתׅ ֶׅׅ׭剅硂 !WWBLBNF
  21. ַֿֿ׵כ ך鑧

  22. 5ZQF4DSJQU׾⢪ֲًٔحز ˖ "OHVMBS+4כ0CKFDUךװ׶ה׶ָ㢳ְ ˖ 㘗➰ֽׅ׷ֿהדծ♶僇זفٗػذ؍פך ،ؙإأծ5ZQPծו׿ו׿䭷䶯ׁ׸׷ ˖ 䒷侧ח㘗׾䭷㹀׃גֶֽלծ铎׏׋㘗׾
 ♷ִג׮؝ٝػ؎ٕؒٓ٦涪欰 ˖

    孡➰ֻךָ傍ְ䝢תזְ
  23. ׋׌׃ ˖ ׮ה׮הؙإך֮׷"OHVMBS+4ך鎸岀זך דծ5ZQF4DSJQU㼪Ⰵחכ䊨㣗ָ䗳銲 ˖ ׉ךֶ鑧׾׃תׅ

  24. $POUSPMMFSךⴱ劍⻉

  25. <body ng-app> <div ng-controller="SampleCtrl"> <strong>First name:</strong> {{firstName}}<br> </div> </body> HTML

    JS function SampleCtrl ($scope) { $scope.firstName = 'John'; $scope.lastName = 'Doe'; ! $scope.getFullName = function () { return $scope.firstName + ' ' + $scope.lastName; }; };
  26. <body ng-app> <div ng-controller="sampleCtrl"> <strong>First name:</strong> {{firstName}}<br> </div> </body> HTML

    JS ! 5ZQF4DSJQUכ♶銲הְֲ倯׮ ֿך剅ֹ倯כװ׭ת׃׳ֲ ֮ה֮הخְٓדׅ ̕ function SampleCtrl ($scope) { $scope.firstName = 'John'; $scope.lastName = 'Doe'; ! $scope.getFullName = function () { return $scope.firstName + ' ' + $scope.lastName; }; };
  27. angular.module('MyAngularJs', [/*...*/]); // Setter ! function SampleCtrl ($scope) { $scope.firstName

    = 'John'; $scope.lastName = 'Doe'; ! $scope.getFullName = function () { return $scope.firstName + ' ' + $scope.lastName; }; }; ! angular.module('MyAngularJs') // Getter .controller('SampleCtrl', [ '$scope', // 使用するServiceは全て文字列で表記 SampleCtrl ]); JS BOHVMBSNPEVMF ׾⢪ְת׃׳ֲ
  28. angular.module('MyAngularJs', [/*...*/]); // Setter ! function SampleCtrl ($scope) { $scope.firstName

    = 'John'; $scope.lastName = 'Doe'; ! $scope.getFullName = function () { return $scope.firstName + ' ' + $scope.lastName; }; }; ! angular.module('MyAngularJs') // Getter .controller('SampleCtrl', [ '$scope', // 使用するServiceは全て文字列で表記 SampleCtrl ]); JS ֿֿ̓׾5ZQF4DSJQUח׃תׅ
  29. TS // ... class SampleCtrl { constructor ( public $scope

    ) { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', ['$scope', SampleCtrl]);
  30. // ... class SampleCtrl { constructor ( public $scope )

    { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', ['$scope', SampleCtrl]); TS ̒׍׳׏ה孡䭯׍䝤ְַ׮׃׸זְ խֽוծ"OHVMBS+4ך䒷侧כ㟓ִָ׍
 խזךד何遤׃גֶֻ ̓،ٗ٦ꟼ侧זךדUIJTָ䭷ׅⰻ㺁כ
 խ㢌׻׵זְ@UIJTהַ׃זֻגְְ ̕DMBTT׾㹑鎉׃תׅ DMBTTך؝ٝأزؙٓةָ床׷̓
  31. class SampleCtrl { constructor ( public $scope ) { //

    ... } } ! class SampleCtrl { public $scope; constructor ($scope) { this.$scope = $scope; // ... } } TS ずֿׄה׾ ׃גתׅ ♳ךקֲָءٝفٕ
  32. ؝ٝػ؎ٕ ˖ ➙剅ְ׋5ZQF4DSJQU׾؝ٝػ؎ٕׅ׷ה ˖ ؒٓ٦
 /sample.ts(1,1): Cannot find name 'angular'.

    ˖ BOHVMBSהְֲ㢌侧כ搀ְה鎉׻׸תׅ
  33. ׉ֿד㘗㹀纏ؿ؋؎ٕ ˖ ➭ך+4ا٦أ荈⵸ח׃׹ծٓ؎ـٓٔח׃׹׾ 欽ְ׷הծ؝ٝػ؎ٓכծוך㢌侧ָ㹑鎉
 幥׫ַⴻ倖דֹתׇ׿ ˖ 㘗㹀纏ؿ؋؎ٕה⿫撑׾⢪ְծ؝ٝػ؎ٓ ח侄ִתׅ

  34. %FOJUFMZ5ZQFE ˖ %FOJUFMZ5ZQFEהְֲ؝ىُصذ؍דכծ
 +4ٓ؎ـٓٔך剣せוֿ׹ח㼎䘔׃׋
 㘗㹀纏ؿ؋؎ٕ׾鞢㺡ח⥂㸚׃גְ׷
 http://definitelytyped.org/ ˖ K2VFSZ %KT 6OEFSTDPSFKT

    +BTNJOF 
 .POHP%#זוזו˘ ˖ ׮׍׹׿"OHVMBS+4׮֮׷
  35. TS /// <reference path="angularjs/angular.d.ts" /> ! class SampleCtrl { constructor

    ( public $scope ) { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', ['$scope', SampleCtrl]); ̓⿫撑׾㹑鎉ׅ׷ה ̕؝ٝػ؎ָٓ㢌侧BOHVMBS׾钠陎㘗➰ֹד
  36. TS declare var angular: any; ! class SampleCtrl { constructor

    ( public $scope ) { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', ['$scope', SampleCtrl]); ̓EFDMBSFהְֲչ،ٝؽؒٝز㹑鎉պ׾欽ְ׷ה խ㘗㹀纏ؿ؋؎ָٕ搀ֻג׮؝ٝػ؎ٓח侄ִ׵׸׷ խ؝ٝػ؎ٕ穠卓חכ䕦갟׃זְ
  37. TS declare var angular: any; ! class SampleCtrl { constructor

    ( public $scope ) { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', ['$scope', SampleCtrl]);
  38. BOZ㘗 ˖ 5ZQF4DSJQUחכOVNCFS TUSJOH CPPMFBOה ְֲفٔىذ؍ـ㘗ָ欽䠐ׁ׸גְ׷ ˖ ׉ך➭ծWPJE OVMM VOEFOFE㘗׮欽䠐ׁ׸גְ׷

    ֿ׸׵ך㘗דך㢌侧㹑鎉כדֹזְ ˖ BOZ㘗כ䖞勻ך+BWB4DSJQUך㘗 ˖ ؝ٝػ؎ٕؒٓ٦׾װ׬׾䖤׆럀׵ׇ׷㜥さװ
 㹀纏ؿ؋؎ٕ׾锃麦דֹזְ㜥さזוח
  39. ًاحسך
 ⴓⶴ

  40. TS // ... ! class SampleCtrl { constructor ( public

    $scope ) { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! // ...
  41. TS // ... ! class SampleCtrl { constructor ( public

    $scope ) { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; ! this.$scope.getFullName = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } } ! // ... ! ͕͜͜૿͑ͦ͏ͳͷ͸ ໨ʹݟ͍͑ͯΔʜ
  42. TS constructor ( public $scope ) { this.init(); ! this.$scope.getFullName

    = () => { return this.$scope.firstName + ' ' + this.$scope.lastName; }; } ! private init() { this.$scope.firstName = 'John'; this.$scope.lastName = 'Doe'; }
  43. TS constructor ( public $scope ) { this.init(); } !

    private init() { // ... } ! public getFullName(): string { return this.$scope.firstName + ' ' + this.$scope.lastName; } ̕䨱׶⦼ך㘗
  44. ?!

  45. غ؎ٝس怩׸ח岣䠐 ˖ TDPQFח秡➰ֽ׵׸גְזְًاحسכ
 ⹛⡲׃תׇ׿ this.$scope.getFullName = () => { return

    // ... }; 何㢌⵸כ׍ׯ׿הغ؎ٝسׁ׸גְ׋
  46. TS constructor ( public $scope ) { this.init(); this.$scope.getFullName =

    this.getFullName.bind(this); } ! private init() { // ... } ! public getFullName(): string { return this.$scope.firstName + ' ' + this.$scope.lastName; } 姻׃ֻכCJOE ׾⢪ְתׅ
  47. ד׮ CJOE׃זֻגְְ 倯岀ָ֮׷

  48. 剑鵚崧遤׶אא֮׷ $POUSPMMFSBT邌鎸

  49. <body ng-app> <div ng-controller="SampleCtrl"> <strong>First name:</strong> {{firstName}}<br> <strong>Last name:</strong> {{lastName}}<br>

    <strong>Full name:</strong> {{getFullName()}}<br> </div> </body> HTML
  50. <body ng-app> <div ng-controller="SampleCtrl as c"> <strong>First name:</strong> {{c.firstName}}<br> <strong>Last

    name:</strong> {{c.lastName}}<br> <strong>Full name:</strong> {{c.getFullName()}}<br> </div> </body> HTML
  51. <body ng-app> <div ng-controller="SampleCtrl as c"> <strong>First name:</strong> {{c.firstName}}<br> <strong>Last

    name:</strong> {{c.lastName}}<br> <strong>Full name:</strong> {{c.getFullName()}}<br> </div> </body> HTML ̕呓秛ׅ׷㢌侧せ ̓㢌侧せفٗػذ؍ խ➰ֽזְהSPPU4DPQF䪔ְ
  52. TS class SampleCtrl { public firstName: string; public lastName: string;

    ! constructor () { this.init(); } ! private init() { this.firstName = 'John'; this.lastName = 'Doe'; } ! public getFullName(): string { return this.firstName + ' ' + this.lastName; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', [SampleCtrl]);
  53. TS class SampleCtrl { public firstName: string; public lastName: string;

    ! constructor () { this.init(); } ! private init() { this.firstName = 'John'; this.lastName = 'Doe'; } ! public getFullName(): string { return this.firstName + ' ' + this.lastName; } } ! angular.module('MyAngularJs') .controller('SampleCtrl', [SampleCtrl]); ̕TDPQF♶銲 ̒TDPQF♶銲 ̒UIJTך湫䱸ךفٗػذ؍ח խז׷ךד㘗׾㹀纏
  54. $POUSPMMFSBT邌鎸כ 5ZQF4DSJQUה湱䚍ְְָ

  55. $POUSPMMFSBTךًٔحز ˖ $POUSPMMFS׾طأز׃׋㜥さחծ㢌侧せך
 ֶַ־ד僇然חז׷ ˖ "OHVMBS+4ך䠐㔳׃זְفٗػذ؍㢌刿׾
 ꣇־׷ ˖ ׉׃גծ5ZQF4DSJQUךؙٓأה湱䚍ְְָ

  56. $POUSPMMFSBTךرًٔحز ˖ QSJWBUFזًاحس׮)5.-♳ד䭷㹀ׅ׸ל ⢪ִג׃תֲ ˖ 5ZQF4DSJQU؝ٝػ؎ٓכ)5.-ח㼎׃גכ⫴ַזְ ˖ )5.-♳ד{{c.$scope.firstName}}הׅ׸ל غ؎ٝسדⵖꣲדֹ׷ָծ׍׳׏הⱔꞿ ˖

    5ZQF4DSJQU׾⢪׻זְז׵㉏겗זְ
  57. ד׮CJOE ׮ 'BDUPSZװ%JSFDUJWFד⢪ִ׷ךד ⚕倯鋙ִגֶֻץ׃

  58. 5ZQF4DSJQUד ׅ׏ֹ׶剅ֽ׷

  59. 4FSWJDFךⴱ劍⻉

  60. ׉ך⵸ח ˖ 4FSWJDFה'BDUPSZך麩ְ
 椚鍑ׁ׸גְתַׅ

  61. 'BDUPSZ angular.module('MyAngularJs') .factory('MyProvider', ['otherProvider', function (otherProvider) { return new MyProvider(otherProvider);

    }]); JS angular.module('MyAngularJs') .service('MyProvider', ['otherProvider', MyProvider]); 4FSWJDF JS
  62. 'BDUPSZ angular.module('MyAngularJs') .factory('MyProvider', ['otherProvider', function (otherProvider) { return new MyProvider(otherProvider);

    }]); JS angular.module('MyAngularJs') .service('MyProvider', ['otherProvider', MyProvider]); 4FSWJDF JS ̓؎ٝأةٝأ׾欰䧭׃ג鵤ׅ ؝ٝأزؙٓة׾♷ִג"OHVMBS+4ָ欰䧭ׅ׷̓ 4JOHMFUPOדׅխ  խ
  63. 'BDUPSZ angular.module('MyAngularJs') .factory('MyProvider', ['otherProvider', function (otherProvider) { return new MyProvider(otherProvider);

    }]); JS angular.module('MyAngularJs') .service('MyProvider', ['otherProvider', MyProvider]); 4FSWJDF JS 5ZQF4DSJQUד 䪔ְװְׅךכ4FSWJDF
  64. ⢪ְⴓֽ ˖ 4JOHMFUPOַծꟼ侧׾תה׭׋0CKFDUַהְֲ麩ְ ˖ 朐䡾⥂㶷כ4FSWJDFח䬐׻ׇ׆SPPU4DPQFחׇׁ׷ץֹ ˖ 'BDUPSZכ0CKFDU׾鵤ׅךדծًٝغךⰕꟚך嚊䙀ח
 鵚ְ׉ךꥷכծBOHVMBSCJOE ׅ׷ ˖

    ⢪ְװְׅ倯דְְה䙼׏ג׷
 5ZQF4DSJQUד剅ֻז׵4FSWJDFַ
  65. أ٦ػ٦ؙٓأכ ˖ ؙٓأك٦أ001הְִל竰䪫 ˖ أ٦ػ٦ؙٓأח꧊秈ׇׁג؟ـؙٓأ׾
 ⡲׸לְְךדכ 
 
 ̔؝ٝأزؙٓةחⰋגך1SPWJEFS׾床ׅ"OHVMBS+4
 խה竰䪫כ湱䚍ָ䝤ְךדծְ׹ְ׹鑐遤ꐪ铎⚥


    խNJYJO׾鑐׃גְ׷ָ姻湫ؔأأًדֹזְ
  66. 4FSWJDF׾ 5ZQF4DSJQUד剅ְ׋⢽

  67. TS class MyResource { constructor( private $q: ng.IQService, private $resource:

    ng.resource.IResourceService ) { // ... } ! private resource(): IResourceClass { var baseApi = '/api/entities'; var params: any = null; var actions = { getWithEntityId: { method: 'GET', url: baseApi+'/:id', isArray: true} }; return <IResourceClass>this.$resource(baseApi, params, actions); } ! public fetchEntity(id: my.obj.EntityId): IPromiseReturnEntity { var dfd = this.deferAcceptEntity(); ! var query = {id: id}; this.resource().getWithEntityId( query, this.success(), this.failure() ).$promise.then(this.fetchThen(dfd)); ! return dfd.promise; } private fetchThen(dfd: IDeferredAcceptEntity): (res: my.obj.IEntities) => void { return (res) => { var e: my.obj.IEntity = res[0]; dfd.resolve(e); }; } } ! angular.module('MyAngularJs') .service('MyResource', ['$q', '$resource', MyResource]);
  68. class MyResource { constructor( private $q: ng.IQService, private $resource: ng.resource.IResourceService

    ) { // ... } ! private resource(): IResourceClass { var baseApi = '/api/entities'; var params: any = null; var actions = { getWithEntityId: { method: 'GET', url: baseApi+'/:id', isArray: true} }; return <IResourceClass>this.$resource(baseApi, params, actions); } ! public fetchEntity(id: my.obj.EntityId): IPromiseReturnEntity { var dfd = this.deferAcceptEntity(); ! var query = {id: id}; this.resource().getWithEntityId( TS ̕BOHVMBSEUTך㘗㹀纏ؿ؋؎ٕ׾崞欽 ٍ̓ؗأز׃זְה鋵ך㘗ה׃גؒٓ٦׾⳿ׅ ̕ⴽךؿ؋؎ٕד杝荈ח*3FTPVSDF$MBTT׾㹀纏 խBOHVMBSEUT׾FYUFOET竰䪫ׇׁגְ׷
  69. isArray: true} }; return <IResourceClass>this.$resource(baseApi, params, actions); } ! public

    fetchEntity(id: number): IPromiseReturnEntity { var dfd = this.deferAcceptEntity(); ! var query = {id: id}; this.resource().getWithEntityId( query, this.success(), this.failure() ).$promise.then(this.fetchThen(dfd)); ! return dfd.promise; } private fetchThen(dfd: IDeferredAcceptEntity): (res: my.obj.IEntities) => void { return (res) => { var e: my.obj.IEntity = res[0]; dfd.resolve(e); }; } } ! angular.module('MyAngularJs') .service('MyResource', ['$q', '$resource', MyResource]); TS ֿֿתדָⰋג䨱׶⦼ך㘗 ̕杝荈ך㘗 ̓杝荈ך㘗 ̕%*ׅ׷1SPWJEFSה荈魦ך؝ٝأزؙٓة խ䧭⸆儗ה㣟侁儗חㄎל׸׷ꟼ侧 ̒➙㔐כꟼ⤘זְ
  70. ♧孡חװ׶ֺׅ׋

  71. 剑䖓ח 㘗㹀纏ؿ؋؎ٕך鑧

  72. آؑطؙٔأ ˖ BOHVMBSEUTװBOHVMBSSFTPVSDFEUTחכ
 החַֻآؑطؙٔأָ⳿גֹתׅ ˖ 䫺䫑䠬ָ֮׷ה׍׳׏הꨇ׃ֻ鋅ִ׷ַ׮

  73. BOHVMBSEUT余殛 $resource<T>(); ↓ ng.resource.IResourceClass<T>型のインスタンス .query(); ↓ ng.resource.IResourceArray<T>型のインスタンス .$promise ↓ ng.IPromise<ng.resource.IResourceArray<T>>型のインスタンス

  74. BOHVMBSEUT余殛 ! ݏΜͳ͖ͬͯͨ $resource<T>(); ↓ ng.resource.IResourceClass<T>型のインスタンス .query(); ↓ ng.resource.IResourceArray<T>型のインスタンス .$promise

    ↓ ng.IPromise<ng.resource.IResourceArray<T>>型のインスタンス
  75. BOHVMBSEUT ng.resource.IResourceClass<T>型のインスタンス .query(); ↓ ng.resource.IResourceArray<T>型のインスタンス .$promise ↓ ng.IPromise<ng.resource.IResourceArray<T>>型のインスタンス .then<TResult>( successCallback:

    (promiseValue: T) => TResult, errorCallback?: (reason: any) => TResult, notifyCallback?: (state: any) => any ): IPromise<TResult>
  76. BOHVMBSEUT ng.resource.IResourceClass<T>型のインスタンス .query(); ↓ ng.resource.IResourceArray<T>型のインスタンス .$promise ↓ ng.IPromise<ng.resource.IResourceArray<T>>型のインスタンス .then<TResult>( successCallback:

    (promiseValue: T) => TResult, errorCallback?: (reason: any) => TResult, notifyCallback?: (state: any) => any ): IPromise<TResult> 殅䠐ׅץֹזךכծֿך鴟כ Ⰻ鿇דչמהאך㘗せպד֮׷הְֲֿה չ5׾䒷侧חה׶53FTVMU׾鵤ׅꟼ侧պ׾䒷侧הׅ׷
  77. דծ穠㽷5חכ ⡦Ⰵ׸׋׵ִִי׿

  78. BOHVMBSEUT余殛 ng.IPromise<ng.resource.IResourceArray<T>>
 ה5ָطأز׃גְ׋ךדծ(promiseValue: T)ך5כ "ng.resource.IResourceArray<T>"Ⰻ⡤׾䭷ׅկ ! "ng.resource.IResourceArray<T>"ך⚥ך5כ ♧殢剑ⴱծ$resource<T>()ה剅ְ׋儗ך5կIResourceArray<T>כ"1* ַ׵鷏׵׸גֻ׷穠卓ךꂁ⴨ךֿהկ !

    את׶ծ׉ךꂁ⴨ך⦐ղך㘗׾$resource<T>()ך5ח䭷㹀׃גֶֽ ל.then()ך⚥ד㘗➰ֽׁ׸׋朐䡾ד⢪ִ׷
  79. *OUFSGBDF׾⢪ֲ ˖ آؑطؙٔأ׾걼籕ח䪔ֲהծ㘗荈⡤ָ
 䒷侧׾׮אךדⱄⵃ欽ך꬗ד㉏겗דׅ ˖ JOUFSGBDF׾㢳欽׃ծ؝٦سⰻח5ָ⳿ג ֿזְ״ֲٓحف׃תׅ ˖ *1SPNJTF3FUVSO&OUJUZ *%FGFSSFE"DDFQU&OUJUZזוכ


    ׉ְֲ׏׋鑐遤ꐪ铎ך劣ծ欰ת׸ת׃׋
  80. 椚鍑ָ帾ת׷ ˖ ⯓➂׋׍ח״׷㘗㹀纏ؿ؋؎ٕכ״ֻדֹ גְ׷ ˖ 㘗㹀纏׾铣׬הծ%PDVNFOU׾铣׬ח
 瘝׃ְ椚鍑ָ䖤׵׸׷ ˖ +BWB4DSJQU׌ֽ׾剅ְגְ׋׵ծֿֿתד
 䠐陎׃זְכ׆

  81. 㘗ח걾׹ֲ 5ZQF4DSJQU׾剅ֲֿ

  82. ׀幠耮֮׶ָהֲ׀ְׂת׃׋