Как комментировать ngdoc для компонента Angular?

Я пишу компонент AngularJS, и мне было интересно, какой правильный способ добавить аннотацию ngdoc как к самому компоненту, так и к функции контроллера.

Есть ли у вас примеры?

Ответ 1

Насколько я знаю, вы не можете документировать components с основной версией ng-doc.

Serenity-Frontstack создал вилку ng-doc и поддерживает компоненты Angular:

* @ngdoc component
* @name app.component:guideItem
*
* @description
* This component shows cards using the item binding for his own building.
*
* @param {object}  item      A object with card data 

Ответ 2

Здесь у вас есть пример:

controller.js:

/**
 * @this vm
 * @ngdoc controller
 * @name dragDropRelation.controller:draggableItemController
 *
 * @description
 *  Controller for the draggableItem component
 */
export default function draggableItemController() {

}

component.js:

import controller from './controller.js';
import templateUrl from './view.html';
/**
 * @ngdoc component
 * @name dragDropRelation.component:draggableItem
 *
 * @description
 * Component that allows to be dragged containing some data.
 * @param {Boolean} used Used flag
 * 
 * @param {String} text Text to display
 * @param {Object} data Data to be saved
 * 
 * @param {Boolean} disabled variable to disable the component
 */
export const component = {
  templateUrl: templateUrl,
  controller: controller,
  bindings: {
    used: '<?',
    text: '<',
    data: '<',
    disabled: '<?',
  },
};

module.js:

import angular from 'angular';
import angularDragDrop from 'angular-drag-drop';
import {component} from './component.js';


/**
 * @ngdoc overview
 * @name dragDropRelation.module:draggableItem
 *
 * @description
 * Module that contains the component draggableItem
 * 
 * @example
 *  <b>script.js</b>
 *  <pre>
 *  import draggableItem from 
 *    './components/drag-drop-relation/draggable-item/module'
 *  angular.module('myModule', [draggableItem]);
 *  </pre>
 * 
 */
export default angular
  .module('draggableItem', [angularDragDrop])
  .component('draggableItem', component)
  .name;

это создаст что-то вроде этого (используя gulp -ngdocs):

NGDocs (моя оригинальная документация по компонентам находится на испанском языке)

Ответ 3

Вы должны использовать @ngdoc overview для определения модуля. И @ngdoc controller для контроллера, @ngdoc service для служб.

Модуль

/**
 * @memberof dugun.leads
 * @ngdoc module
 * @description
 * Leads mean info requsts and inbound calls
 */
angular.module('dugun.leads', [
    // vendor
    'ngRoute',
    'dugun.notifications',
    'dugun.queryString',
    'dugun.search',
    // app
    'dugun.helpers.tableSort',
    'dugun.forms',
    'dugun.leads.infoRequests',
    'dugun.leads.calls'
]);

Маршрут

/**
 * @memberof dugun.leads
 * @ngdoc route
 * @name LeadRoutes
 * @param $routeProvider {provider} $routeProvider
 *
 * @description /providers/:providerId/info
 */
function LeadRoutes($routeProvider) {
    $routeProvider
        .when('/leads', {
            templateUrl: 'leads/list.html',
            controller: 'LeadListCtrl',
            controllerAs: 'leadListCtrl',
            label: 'Çiftler',
            reloadOnSearch: false
        });
}

контроллер

/**
 * Controls Provider
 * @constructor
 * @ngdoc object
 * @memberof dugun.leads
 * @name LeadListCtrl
 * @scope
 * @requires $scope {service} controller scope
 * @requires $route {service} $route
 * @requires $window {service} $window
 * @requires $filter {service} $filter
 * @requires dgNotifications {service} dgNotifications
 * @requires moment {service} moment
 * @requires queryString {service} dugun.queryString:queryString
 * @requires Analytics
 * @requires Leads {factory} Leads service
 */
function LeadListCtrl($scope, $route, $window, $filter,
                      dgNotifications, queryString, moment, Analytics,
                      Leads)