Skip to content

Links and keywords

Keywords turn inline code into links. Write the name of a page, a declaration or an external resource in backticks, and NgDoc links it. When a page moves, its links keep working.

 See it

 Use it

Give a page a keyword in its front matter:

index.mdMarkdownLine 2
---
keyword: InstallationPage
---

Then link to it from any page with inline code that starts with *:

index.mdMarkdown
Read `*InstallationPage` first.

Declarations in your API scopes don't need a keyword. Their name is the keyword:

index.mdMarkdown
Every page exports an `NgDocPage` object.

Kinds of keywords

KindWritten asDefined byUnknown keyword
Page* followed by the keywordkeyword in the front matter of a page or tab, or in ng-doc.api.ts for the API listBuild error
APIThe declaration nameEvery declaration in the ng-doc.api.ts scopesStays plain text
GlobalThe keykeywords in the configuration fileStays plain text

The * prefix marks a page keyword. It lets NgDoc report a link to a page that no longer exists, instead of rendering plain text.

Anchors

Add an anchor to link to part of a page.

  • Page sections: add # and the heading's slug, for example Installation [Manual setup]. The slug is the heading text in lowercase, with punctuation removed and spaces replaced by dashes: ## 5. Add the providers becomes 5-add-the-providers, and ## 4. Map @ng-doc/generated becomes 4-map-ng-docgenerated.
  • API sections: add # and the section heading, for example NgDocBaseInput [Methods].
  • API members: add . and the member name.
index.mdMarkdown
- Property: `NgDocBaseInput.changes`
- Method: `NgDocBaseInput.focus`
- Getter: `NgDocBaseInput.get-value`

Getters and setters take a get- or set- prefix. Page and section anchors are not case-sensitive.

Query parameters

Add query parameters after ?, as in a URL. They work on links to pages, such as the API list page, and on global keywords with type: 'link'. API keywords and other global keywords drop them. This link opens the API list filtered to classes:

index.mdMarkdown
`*ApiReferences?type=Class`

NgDoc API

Keywords in code blocks

API keywords also work inside TypeScript and HTML code blocks. Hover a linked name to see its description:

size.tsTypeScript
import { NgDocSize } from '@ng-doc/ui-kit';

const size: NgDocSize = 'small';

In HTML code blocks, NgDoc links the selectors of your components and directives:

button.htmlHTML
<button ng-doc-button>Click me</button>

 Global keywords

Global keywords link to external sites. Define them under keywords.keywords in the configuration file:

ng-doc.config.tsTypeScript
import { NgDocConfiguration } from '@ng-doc/builder';

const config: NgDocConfiguration = {
  keywords: {
    keywords: {
      nunjucks: {
        title: 'Nunjucks',
        url: 'https://mozilla.github.io/nunjucks/',
      },
    },
  },
};

export default config;

title is optional; the key is used by default. To load keywords for Angular, RxJS or another NgDoc site, use keyword loaders (Link to external APIs).

 Gotchas

Warning

A page keyword that doesn't exist fails the build, and so does an unknown anchor on a page keyword or an API keyword. Check the spelling, and remember that keyword names are case-sensitive.

Next: Templates

Edit this page