Skip to content
This repository has been archived by the owner on Feb 18, 2021. It is now read-only.

Latest commit

 

History

History
1816 lines (1237 loc) · 44.8 KB

README.md

File metadata and controls

1816 lines (1237 loc) · 44.8 KB
Raw

Angular.js EE Snippets for Sublime Text 2/3

Overview

--

--

  • This snippet library provides completions for Angular.js, Angular UI Router and Require.js (focused to the angularjs-ee-boilerplate code).

  • Sublime Text uses fuzzy searching for snippets and completions therefore you don’t have to write triggers completely.

  • All snippets add Angular’s inline notation for dependencies automatically, so you don’t have to type them twice.

How to install

  • Package Control - Docs

    1 - Add Repository

    https://github.com/the-front/sublime-angularjs-ee-snippets

    2 - search for sublime-angularjs-ee-snippets

  • Manually:

    1 - Clone or download git repo into your packages folder (in ST, find Browse Packages... menu item to open this folder)

    $ git clone https://github.com/the-front/sublime-angularjs-ee-snippets.git

    2 - Restart ST editor (if required)

Snippets

Below is a list of all triggers and respectives snippets currently supported on this package.

trigger: [triggerName] TAB key.

Require.js

Require.js: [config]

Description:

config                  Require.js

Content:

require({

  // libraries dependencies (fallback support)
  paths: {

    ${1:lib}: [
      '${2:lib-path}'
    ]$0

  },

  // define js scripts dependencies
  shim: {

    '${1}': {
      ${3:deps: [],}
      ${4:exports: ''}
    }

  },

  priority: [
    '$5'
  ],

  deps: ['./$6']

});

Require.js: [require]

Description:

require                  Require.js

Content:

require('${1:path/file_js}')$0

Require.js: [define]

Description:

define                  Require.js

Content:

define(function(require) {
  'use strict';

  $0

  ${2:return ${1:object_or_function};}

});

Require.js: [load]

Description:

load                  Require.js

Content:

define(function(require) {
  'use strict';

  $0

});

Angular.js EE (Enterprise Edition)

Angular.js EE: [bootstrap]

Description:

bootstrap                  Angular.js EE

Angular.js Style Guide: Y024

Content:

define(function(require) {
  'use strict';

  var angular = require('angular');

  angular.element(document).ready(startAngularApp);

  //---

  function startAngularApp() {
${1:
    console.log('start angular application');
}
    // define angular module to bootstrap application
    var module = angular.module(
      // module name
      '${4:run}',

      // module dependencies
      [
${2:        // enable mock and intercep $HTTP requests
        require('./require.mock.load').name,

}${3:        require('app/main/package').name}
      ]
    );

    // start angular app
    angular.bootstrap(document, [module.name]);

  }$0

});

Angular.js EE: [package]

Description:

package                  Angular.js EE

Content:

define(function(require) {
  'use strict';

  var module = require('./module');
${1:  require('./resource');
}  require('./controller');
  require('./states');$2
  require('./routes');$3

  return module;$0

});

Angular.js EE: [module]

Description:

module                  Angular.js EE

Angular.js Style Guide: Y020 Y021

Content:

define(function(require) {
  'use strict';

  var angular = require('angular');
${2:  require('angularResource');
}
${4:  require('uiRouter');}
${6:  require('uiBootstrap');}

  // angular module definition
  return angular.module(
    // module name
    '${1:moduleName}',

    // module dependencies
    [
${3:      'ngResource',
}
${5:      'ui.router',}
${7:      'ui.bootstrap',
}
${8:      require('shared/fend/input-utils/package').name,
      require('shared/fend/pagination/package').name}
    ]
  );

});

Angular.js EE: [module-use]

Description:

module-use                  Angular.js EE

Content:

define(function(require) {
  'use strict';

  var module = require('$1./module');

  $0

});

Angular.js EE: [mock-package]

Description:

mock-package                  Angular.js EE

Content:

define(function(require) {
  'use strict';

  // allow request pass through angular.js mock url interceptor
  //$1 require('./allow-pass');

  /**/$2
  require('./data'); // local mock data
  require('./url-interceptors'); // intercepts and responds
  /*$3*/

});

Angular.js EE: [mock-pass-urls]

Description:

mock-pass-urls                  Angular.js EE

Angular.js Style Guide: Y024 Y091

Content:

define(function(require) {
  'use strict';

  var backend = require('shared/mock/backend');

  backend.addResource(AllowPass);

  //---

  // mock resource dependencies injection
  AllowPass.\$inject = [${1/(?:.+)/'/g}${1/,[ ]*/', '/g}${1/(?:.+)/', /g}$5];

  // mock resource definition
  function AllowPass(${1:\$httpBackend, regexpUrl}) {

${2:    // Allow GET users from GitHub API}
    ${4:\$httpBackend
      .when('GET', regexpUrl(/${3:api\.github\.com\/users}(\/)?([A-z0-9]+)?\$/))
      .passThrough();}$0

  }

});

Angular.js EE: [mock-pass-backend]

Description:

mock-pass-backend                  Angular.js EE

Angular.js Style Guide: Y024 Y091

Content:

define(function(require) {
  'use strict';

  var backend = require('shared/mock/backend');

  backend.addResource(AllowPass);

  //---

  AllowPass.\$inject = [${1/(?:.+)/'/g}${1/,[ ]*/', '/g}${1/(?:.+)/', /g}$6];

  function AllowPass(${1:\$httpBackend, regexpUrl}) {

    //--- @begin: Allow pass to server

    // get all
    \$httpBackend
      .when('GET', regexpUrl(/${2:rest}\/${3:resource}(\?|\$)/))
      .passThrough();

    // get one
    \$httpBackend
      .when('GET', regexpUrl(/$2\/$3(\/)?([A-z0-9]+)?\$/))
      .passThrough();

    // create
    \$httpBackend
      .when('POST', regexpUrl(/$2\/$3\$/))
      .passThrough();

    // update
    \$httpBackend
      .when('PUT', regexpUrl(/$2\/$3(\/)?([A-z0-9]+)?\$/))
      .passThrough();

    // delete
    \$httpBackend
      .when('DELETE', regexpUrl(/$2\/$3(\/)?([A-z0-9]+)?\$/))
      .passThrough();

${5:    // search
    \$httpBackend
      .when('GET', regexpUrl(/$2\/$3\/${4:search}\/([A-z0-9]+)(\?|\$)/))
      .passThrough();}

    //--- @end: Allow pass to server

  }

});

Angular.js EE: [mock-data]

Use LokiJS to manage object collection

Description:

mock-data                  Angular.js EE

Angular.js Style Guide: Y024 Y091

Content:

define(function(require) {
  'use strict';

  var module = require('shared/mock/module');

  module.factory('${1:Name}Collection', $1CollectionFactory);

  //---

  $1CollectionFactory.\$inject = ['DataStore', 'Helpers', '\$log'];

  function $1CollectionFactory(DataStore, helpers, console) {

    console.debug('$1Collection');

    /*
      options = {
        name: '',
        objType: '',
        hasOwnId: false, // save and use this 'id 'as '_id' inside collection?
        indicesArray: ['id'],
        fn: {
          searchValue: function(data, find) {},
          init: function( collection ) {}
        }
      }
    */
    var collection = DataStore.create({
      name: '${1/([A-Za-z0-9]+)?/(?2::\l$1)/g}',
      objType: '${3:$1$2}',
      //hasOwnId: true,
      indicesArray: ['id', 'name'$4],
      fn: {
        searchValue: function(data, find) {

          if(!find) return [];

          var r = [], obj,
              regexp = new RegExp(find, 'i'),
              len = data.length;

          for (var i = 0; i < len; i++) {
            obj = data[i];

            if(obj.name.match(regexp) || obj.description.match(regexp))
              r.push(obj);
          }

          return r;

        },

        init: function( collection ) {

          console.debug( 'init $1Collection' );

          var seq = 0;

${5:          // manual fake data definition}
          ${6:collection.insert({
            id          : seq,
            name        : 'manual fake $3 name ' + (seq+1),
            description : 'manual some fake $3 descrition ' + (seq+1)
          \});
          seq++;
          }$0

          for (var i = 42; i > 0; i--) {
            collection.insert({
              id          : seq,
              name        : 'fake $3 name ' + (seq+1),
              description : 'some fake $3 descrition ' + (seq+1)
            });
            seq++;
          }


        }
      }
    });


    function $1Collection() {}
    var ClassDef = helpers.extendsFn( $1Collection, collection );

    ClassDef.prototype.sayMyName = function() {
      return 'Angular.js : $1Collection Mock';
    };

    var instance = new $1Collection();

    console.debug( instance.sayMyName() );
    console.debug( instance );
    console.debug( instance.list() );

    return instance;

  }

});

Angular.js EE: [mock-backend]

Complete CRUD + Search

Description:

mock-backend                  Angular.js EE

Angular.js Style Guide: Y024 Y091

Content:

define(function(require) {
  'use strict';

  var angular = require('angular');
  var backend = require('shared/mock/backend');
  require('./data$1');

  backend.addResource(UrlInterceptors);

  //---

  UrlInterceptors.$inject = [
    '${2:Name}Collection', 'Helpers',
    '\$httpBackend', 'regexpUrl', 'getParams',
    '\$log',$3
  ];

  function UrlInterceptors(
    collection, helpers, \$httpBackend,
    regexpUrl, getParams, console$4
  ) {

    //--- @begin: URL interceptor$0

    // get all
    \$httpBackend.when('GET', regexpUrl(/${5:rest}\/${6:resource}(\?|\$)/))
      .respond(function(method, url, data) {

        console.debug('GET ' + url);

        var result,
            params = getParams(url),
            options = {page: 1, size: 10};

        if(params) {
          console.debug(params);
          options.page = params.page;
          options.size = params.size;
        }

        result = collection.list(options);

        return [200, angular.copy(result)];
      });

    // get one
    \$httpBackend.when('GET', regexpUrl(/$5\/$6(\/)?([A-z0-9]+)?\$/))
      .respond(function(method, url, data) {
        console.debug('GET ' + url);

        var result,
            regexp = /$5\//,
            id = helpers.getIdFromURL(url, regexp),
            object = collection.getById(id);

        if(object) {
          result = [200, angular.copy(object)];
        } else {
          result = [404, helpers.notFound(id)];
        }

        return result;
      });

    // create
    \$httpBackend.when('POST', regexpUrl(/$5\/$6\$/))
      .respond(function(method, url, data) {
        console.debug('POST ' + url);

        data = angular.fromJson(data);
        data = collection.insert(data);

        console.debug(data);

        return [201, angular.copy(data)];
      });

    // update
    \$httpBackend.when('PUT', regexpUrl(/$5\/$6(\/)?([A-z0-9]+)?\$/))
      .respond(function(method, url, data) {
        console.log('PUT ' + url);

        data = angular.fromJson(data);

        collection.update(data);

        console.debug(data);

        return [202, angular.copy(data)];
      });

    // delete
    \$httpBackend.when('DELETE', regexpUrl(/$5\/$6(\/)?([A-z0-9]+)?\$/))
      .respond(function(method, url, data) {
        console.debug('DELETE ' + url);

        var result,
            bookmark,
            regexp = /$5\//,
            id = helpers.getIdFromURL(url, regexp),
            object = collection.getById(id);

        if(object) {
          collection.remove(object);
          result = [202, helpers.createResultMessage(202, '$2 id: ' + id + ' removed')];
        } else {
          result = [404, helpers.notFound(id)];
        }

        return result;

      });

${8:    // search
    \$httpBackend.when('GET', regexpUrl(/$5\/$6\/${7:search}\/([A-z0-9]+)(\?|\$)/))
      .respond(function(method, url, data) {
        console.debug('GET ' + url);

        var result,
            regexp = /$6\/$7\//,
            find = helpers.getValueFromURL(url, regexp),
            params = getParams(url),
            options = {page: 1, size: 10\};

        if(params) {
          console.debug(params);
          options.page = params.page;
          options.size = params.size;
        \}

        console.debug(find);

        result = collection.search(find, options);

        return [200, angular.copy(result)];
      \});
}
    //--- @end: URL interceptor

${9:    console.debug('$2 Mock URL Interceptors');
    console.debug(collection.getById(1));
    console.debug(collection.list());
}
  }

});

Angular.js EE: [mock-urls]

Description:

mock-urls                  Angular.js EE

Angular.js Style Guide: Y024 Y091

Content:

define(function(require) {
  'use strict';

  var angular = require('angular');
  var backend = require('shared/mock/backend');${2:
  require('./data$1');}

  backend.addResource(UrlInterceptors);

  //---

  UrlInterceptors.$inject = [
    'Helpers', '\$httpBackend', 'regexpUrl',
    'getParams', '\$log',$3
  ];

  function UrlInterceptors(
    helpers, \$httpBackend, regexpUrl,
    getParams, console$4
  ) {

    //--- @begin: URL interceptor

    $0

    //--- @end: URL interceptor

  }

});
Angular.js EE: [mock-w-all]

HTTP GET - all

Description:

mock-w-all                  Angular.js EE

Content:

// get all
${1:\$httpBackend}.when('GET', regexpUrl(/${2:rest}\/${3:resource}(\?|\$)/))
  .respond(function(method, url, data) {

    console.debug('GET ' + url);

    var result,
        params = getParams(url)${4:,
        options = {page: 1, size: 10\};

    if(params) {
      console.debug(params);
      options.page = params.page;
      options.size = params.size;
    \}}$0

    result = ${5:collection.list(options);}

    return [200, angular.copy(result)];
  });
Angular.js EE: [mock-w-one]

HTTP GET - one (by id)

Description:

mock-w-one                  Angular.js EE

Content:

// get one
${1:\$httpBackend}.when('GET', regexpUrl(/${2:rest}\/${3:resource}(\/)?([A-z0-9]+)?\$/))
  .respond(function(method, url, data) {
    console.debug('GET ' + url);

    var result,
        regexp = /$2\//,
        id = helpers.getIdFromURL(url, regexp),
        object = ${4:collection.getById(id);}$0

    if(object) {
      result = [200, angular.copy(object)];
    } else {
      result = [404, helpers.notFound(id)];
    }

    return result;
  });
Angular.js EE: [mock-w-post]

HTTP POST - create

Description:

mock-w-post                  Angular.js EE

Content:

// create
${1:\$httpBackend}.when('POST', regexpUrl(/${2:rest}\/${3:resource}\$/))
  .respond(function(method, url, data) {
    console.debug('POST ' + url);

    data = angular.fromJson(data);
    data = ${4:collection.insert(data);}$0

    console.debug(data);

    return [201, angular.copy(data)];
  });
Angular.js EE: [mock-w-put]

HTTP PUT - update

Description:

mock-w-put                  Angular.js EE

Content:

// update
${1:\$httpBackend}.when('PUT', regexpUrl(/${2:rest}\/${3:resource}(\/)?([A-z0-9]+)?\$/))
  .respond(function(method, url, data) {
    console.log('PUT ' + url);

    data = angular.fromJson(data);

    ${4:collection.update(data);}$0

    console.debug(data);

    return [202, angular.copy(data)];
  });
Angular.js EE: [mock-w-delete]

HTTP DELETE

Description:

mock-w-delete                  Angular.js EE

Content:

// delete
${1:\$httpBackend}.when('DELETE', regexpUrl(/${2:rest}\/${3:resource}(\/)?([A-z0-9]+)?\$/))
  .respond(function(method, url, data) {
    console.debug('DELETE ' + url);

    var result,
        regexp = /$2\//,
        id = helpers.getIdFromURL(url, regexp),
        object = ${5:collection.getById(id);}$0

    if(object) {
      ${6:collection.remove(object);}
      result = [202, helpers.createResultMessage(202, '$3$4 id: ' + id + ' removed')];
    } else {
      result = [404, helpers.notFound(id)];
    }

    return result;

  });
Angular.js EE: [mock-w-search]

HTTP GET - search collection by value

Description:

mock-w-search                  Angular.js EE

Content:

// search
${1:\$httpBackend}.when('GET', regexpUrl(/${2:rest}\/${3:resource}\/${4:search}\/([A-z0-9]+)(\?|\$)/))
  .respond(function(method, url, data) {
    console.debug('GET ' + url);

    var result,
        regexp = /$3\/$4\//,
        find = helpers.getValueFromURL(url, regexp),
        params = getParams(url)${6:,
        options = {page: 1, size: 10\};

    if(params) {
      console.debug(params);
      options.page = params.page;
      options.size = params.size;
    \}}$0

    console.debug(find);

    result = ${5:collection.search(find, options);}

    return [200, angular.copy(result)];
  \});

Angular UI Router

Angular UI Router: [stateProvider]

Description:

stateProvider                  Angular UI Router

Angular.js Style Guide: Y024 Y091

Content:

config(configureStates);

//--- https://github.com/angular-ui/ui-router/wiki

configureStates.\$inject = ['\$stateProvider', '\$urlRouterProvider'];

function configureStates(\$stateProvider, \$urlRouterProvider) {

${2:  \$urlRouterProvider
    .when('', '/$1') // default
    .when('/', '/$1') // default
    .otherwise('/404'); // For any unmatched url, redirect to /404
}
  \$stateProvider
    .state('${1:state}', {
      url: '/$1',
      views: {
        'master': {
          templateUrl   : 'app/main/templates/layout$3.html'
        },
        'content@$1': {
          templateUrl   : 'app/$1/${5:template}.html',
          controller    : '${1/([A-Za-z0-9]+)?/(?2::\u$1)/g}Ctrl',
          controllerAs  : 'vm$4'
        }
      }
    })$0;

}

Angular UI Router: [state]

Description:

state                  Angular UI Router

Content:

state('${1:name}.${2:substate}', {
  url: '/$2',
  views: {
    'content@$1': {
      templateUrl   : 'app/$1/templates/$2.html',
      controller    : '${1/([A-Za-z0-9]+)?/(?2::\u$1)/g}$3$2Ctrl',
      controllerAs  : 'vm$4'
    }
  }
})$0

Angular UI Router: [urlRouterProvider]

Description:

urlRouterProvider                  Angular UI Router

Content:

\$urlRouterProvider
  .when('$1', '/$2')
  .otherwise("/${3:redirectTo}")$0;

Angular UI Router: [when]

Description:

when                  Angular UI Router

Content:

when('$1', '/$2')$0

Angular UI Router: [otherwise]

Description:

otherwise                  Angular UI Router

Content:

otherwise("/${1:redirectTo}")$0

Angular.js

Angular.js: [module]

Description:

module                  Angular.js

Angular.js Style Guide: Y020 Y021

Content:

module(
  // module name
  '${1:moduleName}',

  // module dependencies
  [
    // 'dependencyModuleName',
    $2
  ]
);

Angular.js: [constant]

Description:

constant                  Angular.js

Content:

constant('${1:name}', ${2:value});

Angular.js: [value]

Description:

value                  Angular.js

Content:

value('${1:name}', ${2:value});

Angular.js: [config]

Description:

config                  Angular.js

Angular.js Style Guide: Y024 Y091

Content:

config(${3:configure});

//---

$3.\$inject = [${1/(?:.+)/'/g}${1/,[ ]*/', '/g}${1/(?:.+)/',/g} ${2}];

function $3($1) {

  ${0:// TODO: define code}

}

Angular.js: [run]

Description:

run                  Angular.js

Angular.js Style Guide: Y024 Y091

Content:

run(runner);

//---

runner.\$inject = [${1/(?:.+)/'/g}${1/,[ ]*/', '/g}${1/(?:.+)/',/g} $2];

function runner($1) {

  ${0:// TODO: define code}

}

Angular.js: [filter]

Description:

filter                  Angular.js

Angular.js Style Guide: Y024

Content:

filter('${1:name}', $1);

//--- https://docs.angularjs.org/guide/filter

function $1() {

  return function(input, ${2:configValue}) {
    input = input || '';
    var out = '';

    ${0:// TODO: define filter process code}

    return out;
  };

}

Angular.js: [decorator]

Description:

decorator                  Angular.js

Angular.js Style Guide: Y024 Y091

Content:

decorator('${1:name}', $1Decorator);

//--- https://docs.angularjs.org/api/auto/service/\$provide

$1Decorator.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];

function $1Decorator(${2:\$delegate}) {

  // TODO: define decorator$0

  return ${7:\$delegate};
}

Angular.js: [provider]

Description:

provider                  Angular.js

Angular.js Style Guide: Y024 Y091

Content:

provider('${1:name}', $1);

//--- https://docs.angularjs.org/guide/providers

function $1() {

  this.\$get = $2;

  //---

  $2.\$inject = [${3/(?:.+)/'/g}${3/,[ ]*/', '/g}${3/(?:.+)/',/g} $4];

  function ${2:$1Get}($3) {
    return {$0};
  }

}

Angular.js: [service]

Description:

service                  Angular.js

Angular.js Style Guide: Y024 Y091

Content:

service('${1:name}', $1);

//---

$1.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];

function $1($2) {
  var service = this;

  // TODO: review
  service.att = 'value';
  service.privateFunc = privateFunc;

  ${0://TODO: define code}

  //---

  function privateFunc() {
    return 'hello external world';
  }

}

Angular.js: [factory]

Description:

factory                  Angular.js

Angular.js Style Guide: Y024 Y050 Y051 Y052 Y053 Y091

Content:

factory('${1:Name}', $1);

//---

$1.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];

function $1($2) {

  var service = {
    attr: 'value',
    func: hiddenFunction$0
  };

  //---

  function hiddenFunction() {

    // TODO: define

  }

  //---

  return service;

}

Angular.js: [controller]

Description:

controller                  Angular.js

Angular.js Style Guide: Y024 Y030 Y091

Content:

controller('${1:Name}Ctrl', $1Ctrl);

//---

$1Ctrl.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];

function $1Ctrl($2) {
  var vm = this;

  ${4:// TODO: define vm (ViewModel) attribures}

  //---

  ${5:// TODO: define internal processing code}

}

Angular.js: [directive]

Description:

directive                  Angular.js

Angular.js Style Guide: Y024 Y070 Y073 Y074

Content:

directive('${1:name}', $1);

//--- https://docs.angularjs.org/guide/directive

function $1() {

  var directive = {
    restrict: 'EA$2',
    link: $3
  };

  //---

  function ${3:linkingFn}(scope, element, attrs) {

    ${0:// TODO: define code}

  }

  //---

  return directive;

}

Angular.js: [directiveLong]

Description:

directiveLong                  Angular.js

Angular.js Style Guide: Y024 Y070 Y072 Y073 Y074 Y075 Y091

Content:

directive('${1:name}', $1);

//---

// https://docs.angularjs.org/guide/directive
// https://docs.angularjs.org/api/ng/service/\$compile

${4:$1.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];
}
function $1($2) {

  var scope = {
    max: '='$5
  };

  var directive = {
    restrict: 'EA$6',
    scope: scope,

    controller: ControllerFn,
    controllerAs: 'vm$7',
    // So our isolated scope will be stored
    // on the `this` context of our controller
    // instead of $scope
    bindToController: true,

    link: linkingFn,

    template: templateFn,
    templateUrl: templateUrlFn
  };

  //---

  // ControllerFn.\$inject = [];

  function ControllerFn() {
    var vm = this;$0

    vm.min = 3;
    console.log('CTRL: vm.min = %i', vm.min);
    console.log('CTRL: vm.max = %i', vm.max);
  }

  //---

  function linkingFn(scope, el, attr, ctrl) {
    console.log('LINK: scope.max = %i', scope.max);
    console.log('LINK: scope.vm.min = %i', scope.vm.min);
    console.log('LINK: scope.vm.max = %i', scope.vm.max);
  }

  //---

  function templateFn(tElement, tAttrs) {
    return [
      '<div>min: {{vm.min}} :: max: {{vm.max}}</div>'
    ].join('');
  }

  //---

  function templateUrlFn(tElement, tAttrs) {
    return 'path/directive/template.html';
  }

  //---

  return directive;

}

ngResource

Angular.js: [resource-id]

Description:

resource-id                  Angular.js

Angular.js Style Guide: Y024 Y050 Y091

Content:

factory('${1:Name}Resource', $1Resource);

//--- https://docs.angularjs.org/api/ngResource/service/$resource

$1Resource.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];

function $1Resource(${2:\$resource}) {

  return \$resource(
    '${4:rest}/${1/([A-Za-z0-9]+)?/(?2::\l$1)/g}/:id',
    {
      'id': ''$0
    },
    {
      'update': { 'method': 'PUT' }
    }
  );

}
Angular.js: [resource]

Description:

resource                  Angular.js

Angular.js Style Guide: Y024 Y050 Y091

Content:

factory('${1:Name}Resource', $1Resource);

//--- https://docs.angularjs.org/api/ngResource/service/$resource

$1Resource.\$inject = [${2/(?:.+)/'/g}${2/,[ ]*/', '/g}${2/(?:.+)/',/g} $3];

function $1Resource(${2:\$resource}) {

  return \$resource(
    '${4:rest}/${1/([A-Za-z0-9]+)?/(?2::\l$1)/g}'$0
  );

}

ngRoute

Angular.js: [routeProvider]

Description:

routeProvider                  Angular.js ngRoute

Angular.js Style Guide: Y024 Y091

Content:

config(configureRoutes);

//--- https://docs.angularjs.org/api/ngRoute

configureRoutes.\$inject = ['\$routeProvider'];

function configureRoutes(\$routeProvider) {

  \$routeProvider
    .when(
      '/${1:route}',
      {
        templateUrl   : '${3:app}/${4:module}/${5:template}.html',
        controller    : '${2:ControllerName}Ctrl',
        controllerAs  : 'vm$6'
      }
    )$0;

}
Angular.js: [when]

Description:

when                  Angular.js ngRoute

Content:

when(
  '/${1:route}',
  {
    templateUrl   : '${3:app}/${4:module}/${5:template}.html',
    controller    : '${2:ControllerName}Ctrl',
    controllerAs  : 'vm$6'
  }
)$0
Angular.js: [otherwise]

Description:

otherwise                  Angular.js ngRoute

Content:

otherwise(${1:{ redirectTo: '/${2:route}' \}})

Globals

triggercompletion
angular.bind
angular.bind({self}, {function})
angular.bootstrap
angular.bootstrap({element}{, [{modules}]})
angular.copy
angular.copy({source}{, {destination}})
angular.element
angular.element({element})
angular.equals
angular.equals({obj1}, {obj2})
angular.extend
angular.extend({destination}, {source})
angular.forEach
angular.forEach({obj}, {iterator})
angular.fromJson
angular.fromJson({jsonString})
angular.identity
angular.identity()
angular.injector
angular.injector([{modules}])
angular.isArray
angular.isArray({value})
angular.isDate
angular.isDate({value})
angular.isDefined
angular.isDefined({value})
angular.isElement
angular.isElement({value})
angular.isFunction
angular.isFunction({value})
angular.isNumber
angular.isNumber({value})
angular.isObject
angular.isObject({value})
angular.isString
angular.isString({value})
angular.isUndefined
angular.isUndefined({value})
angular.lowercase
angular.lowercase({string})
angular.module
angular.module('{moduleName}', [])
angular.noop
angular.noop
angular.toJson
angular.toJson({string})
angular.uppercase
angular.uppercase({string})
angular.version
angular.version

jQuery lite

triggercompletion
angular: addClass
addClass({className})
angular: after
after({el})
angular: append
append({el})
angular: attr
attr({el})
angular: bind
bind({eventType}{, eventData}{, eventHandler})
angular: children
children()
angular: clone
clone({withDataAndEvents})
angular: contents
contents({withDataAndEvents})
angular: css
css({propertyName(s)})
angular: data
data({key, value | obj})
angular: eq
eq({index})
angular: find
find({tag})
angular: hasClass
hasClass({className})
angular: html
html()
angular: next
next()
angular: parent
parent()
angular: prepend
prepend({content})
angular: prop
prop({propertyName})
angular: ready
ready({handler})
angular: remove
remove({selector})
angular: removeAttr
removeAttr({attributeName})
angular: removeClass
removeClass({className})
angular: removeData
removeData({name})
angular: replaceWith
replaceWith({newContent})
angular: text
text()
angular: toggleClass
toggleClass({className})
angular: triggerHandler
triggerHandler({eventType})
angular: unbind
unbind({eventType{, handler})
angular: val
val({eventType{, handler})
angular: wrap
wrap({wrappingElement})
angular: controller
controller({name})
angular: injector
injector()
angular: scope
scope()
angular: inheritedData
inheritedData()

Scope functions

triggercompletion
angular: $apply
apply({exp})
angular: $broadcast
broadcast({name}{, args})
angular: $destroy
destroy()
angular: $digest
digest()
angular: $emit
emit({name}{, args})
angular: $eval
eval({expression})
angular: $evalAsync
evalAsync({expression})
angular: $new
new({isolate})
angular: $on
on({name}, {listener})
angular: $watch
watch({watchExpression}{, listener}{, objectEquality})
angular: $watchCollection
watchCollection({obj}, {listener})
angular: $id
id

Log functions

triggercompletion
angular: $log.debug
log.debug('{debug}')
angular: $log.error
log.error('{error}')
angular: $log.info
log.info('{info}')
angular: $log.log
log.log('{log}')
angular: $log.warn
log.warn('{warning}')
angular: $log.assertEmpty
log.assertEmpty()
angular: $log.reset
log.reset()

Variables

triggercompletion
angular: $angular
angular
angular: $anchorScroll
anchorScroll
angular: $animation
animation
angular: $animator
animator
angular: $cacheFactory
cacheFactory
angular: $compile
compile
angular: $controller
controller
angular: $exceptionHandler
exceptionHandler
angular: $location
location
angular: $locationProvider
locationProvider
angular: $log
log
angular: $parse
parse
angular: $resource
resource
angular: $rootElement
rootElement
angular: $rootScope
rootScope
angular: $route
route
angular: $routeParams
routeParams
angular: $routeProvider
routeProvider
angular: $templateCache
templateCache
angular: $timeout
timeout
angular: $scope
scope

Directives (on HTML)

IMPORTANT

Completions won’t show in HTML unless you have added this line to your User.sublime-preferences:

"auto_complete_triggers": [
  {"selector": "text.html", "characters": "<"},
  {"selector": "text.html meta.tag", "characters": " " }
]

Angular UI Router

TODO: define items

--

triggercompletion
ng-animateng-animate="{enter: '{example}-enter', leave: '{example}-leave'}"
ng-animatesng-animate="'{class-prefix}'"
ng-appng-app=""
ng-bindng-bind=""
ng-bind-html-unsafeng-bind-html-unsafe=""
ng-bind-templateng-bind-template=""
ng-changeng-change=""
ng-checkedng-checked=""
ng-classng-class=""
ng-class-evenng-class-even=""
ng-class-oddng-class-odd=""
ng-clickng-click=""
ng-cloakng-cloak
ng-controllerng-controller="{Name}Ctrl"
ng-dblclickng-dblclick=""
ng-disabledng-disabled=""
ng-formng-form=""
ng-hideng-hide=""
ng-hrefng-href=""
ng-ifng-if=""
ng-includeng-include="{template}" {onload="" autoscroll=""}
ng-initng-init=""
ng-keydownng-keydown=""
ng-keypressng-keypress=""
ng-keyupng-keyup=""
ng-listng-list=""
ng-modelng-model=""
ng-mousedownng-mousedown=""
ng-mouseenterng-mouseenter=""
ng-mouseleaveng-mouseleave=""
ng-mousemoveng-mousemove=""
ng-mouseoverng-mouseover=""
ng-mouseupng-mouseup=""
ng-multipleng-multiple=""
ng-nbindng-non-bindable=""
ng-openng-open=""
ng-pluralizeng-pluralize count="" when="'': '{}'"
ng-readonlyng-readonly=""
ng-repeatng-repeat="{item} in {array}"
ng-selectedng-selected=""
ng-showng-show=""
ng-srcng-src=""
ng-styleng-style=""
ng-submitng-submit=""
ng-swipe-leftng-swipe-left=""
ng-swipe-rightng-swipe-right=""
ng-switchng-switch on=""
ng-switch-defaultng-switch-default=""
ng-switch-whenng-switch-when=""
ng-transcludeng-transclude
ng-viewng-view

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

CHANGELOG

Check Releases

LICENSE