angular - Yeoman Advent Calendar 2015

既に定番のangular を紹介する。このエントリーは「Yeoman Advent Calendar 2015」12月5日の記事です。

www.npmjs.com

インストール

$ npm install -g  generator-karma generator-angular
$ mkdir mydir && cd $_
$ yo angular

実行

$ grunt serve

ブラウザが立ち上がりアプリが表示される

コマンド

• angular (aka angular:app)
• angular:controller
• angular:directive
• angular:filter
• angular:route
• angular:service
• angular:provider
• angular:factory
• angular:value
• angular:constant
• angular:decorator
• angular:view

Angular1.5から追加されたcomponentはまだ定義されていない（使われているAngularのバージョンは1.4）。

新たに

GruntとGulpのどちらでも利用可能でTypeScriptのサポートも。

/// <reference path="../app.ts" />

'use strict';

module sampleAppApp {
  export interface IAboutScope extends ng.IScope {
    awesomeThings: any[];
  }

  export class AboutCtrl {

    constructor (private $scope: IAboutScope) {
      $scope.awesomeThings = [
        'HTML5 Boilerplate',
        'AngularJS',
        'Karma'
      ];
    }
  }
}

angular.module('sampleAppApp')
  .controller('AboutCtrl', sampleAppApp.AboutCtrl);

最後に

TypeScriptの勉強にも最適！