Как запустить snippet директивы для angulsrjs?

Question

[vasIvas]

В sublime text 3 есть сниппет директивы, который у меня никак не получается запустить.
Ниже сам сниппет, если кто-то сталкивался с подобным, заполните его правильно -

<div my-directive="good"></div>
.directive('', ['', function(){
	// Runs during compile
	return {
		// name: '',
		// priority: 1,
		// terminal: true,
		// scope: {}, // {} = isolate, true = child, false/undefined = no change
		// controller: function($scope, $element, $attrs, $transclude) {},
		// require: 'ngModel', // Array = multiple requires, ? = optional, ^ = check parent elements
		// restrict: 'A', // E = Element, A = Attribute, C = Class, M = Comment
		// template: '',
		// templateUrl: '',
		// replace: true,
		// transclude: true,
		// compile: function(tElement, tAttrs, function transclude(function(scope, cloneLinkingFn){ return function linking(scope, elm, attrs){}})),
		link: function($scope, iElm, iAttrs, controller) {
			
		}
	};
}]);

Answer 1

[Сергей Протько]

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

Если мы заполним за вас, то соблаговолите разукрасить:



Updated
Черт... не думал что вы это сделаете ну... теперь не отвертеться...

.directive('', ['', function(){

что тут происходит. Первые пустые кавычки - имя директивы. Записывается в camel case, используется с нижним подчеркиванием (так уж повелось с DOM).

.directive('someDirective', fn);
// <some-directive></some-directive>

дальше, у нас есть массив, в котором одни пустые кавычки и функция. Это такой вот кастыль (по другому не выйдет сказать) что бы описать зависимости директивы. Можно заменить массив просто на функцию, но если вы будете прописывать зависимости от сервисов (например от $q) при минификации все сломается. Дело в том, что если мы явно не указали проперти $inject у функции, которую передаем, то angular будет пытаться подобрать зависимости по названиям аргументов. И тут проблемы - при минификации имена аргументов меняются и... все плохо. Потому либо явно прописываем $inject либо используем array notation, при котором сначала идут оригинальные названия сервисов, а последним элементом массива - функция, в которое это все будет инджектиться. Ну и справедливости ради - есть ng-annotate который все это автоматизирует.

По поводу пропертей, основы - link - это та функция, которая связывает конкретный DOM элемент и директиву. По сути именно тут должно происходить работа с DOM. Еще из часто используемых свойств является controller, там собственно.... контроллер, который содержит именно логику работы директивы. Контроллер может шарится между зависимыми директивами (зависимости описываются через require и описывают положение относительно других директив в DOM).

А вот compile - самое пожалуй редкоиспользуемое свойство, так как это очень специфичные задачи нужны что бы задействовать всю мощь этой штуки (обычно что-то связанное с оптимизациями).

Собственно по тому как и что писать в директивах много написано.

Comments

[vasIvas]

Если я удаляю кавычки из массива в который помещена и она, то начинает работать. Но ведь этот сниппет сделали не глупые и значит что-то не понимаю я.. Из-за чего так может быть?

[vasIvas]

[vasIvas]

Спасибо, но я так и не понял, почему если не удалить
app.directive('', ['вот эти кавычки', function(){
то вылетает ошибка? Пробовал туда и параметры из link и $inject прописать, но ошибка остается. Почему?

[vasIvas]

Тьфуты, нужно $injector написать. Странный все же сниппет... Обязательно нужно $injector, но сразу не написали...

[Сергей Протько]

vasIvas: нет, не $injector. $injector это контейнер зависимостей. сервис. Если у вас нет зависимостей то просто уберите массив и оставьте только функцию.