@loopback/docs
Version:
Documentation for LoopBack 4
121 lines (88 loc) • 3.36 kB
Markdown
---
lang: en
title: 'Add TodoList Model'
keywords: LoopBack 4.0, LoopBack 4
sidebar: lb4_sidebar
permalink: /doc/en/lb4/todo-list-tutorial-model.html
summary: LoopBack 4 TodoList Application Tutorial - Add TodoList Model
---
### Building a checklist for your Todo models
A todo item is often grouped into a checklist along with other todo items so
that it can be used to measure the progress of a bigger picture.
A data set can often be related to another data set, so that an entity may be
able to provide access to another entity based on its relationship with the
other entity. To take `TodoListApplication` one step further and establish
relations with the existing `Todo` model as real-world applications often tend
to do, we'll introduce the model `TodoList`.
We'll create the `TodoList` model to represent a checklist that contains
multiple Todo items. Let's define TodoList model with the following properties:
- a unique id
- a title
- a color to represent the TodoList with
We can use the `lb4 model` command and answer the prompts to generate the model
for us as follows:
```sh
$ lb4 model
? Model class name: TodoList
? Please select the model base class Entity
? Allow additional (free-form) properties? No
Let's add a property to TodoList
Enter an empty property name when done
? Enter the property name: id
? Property type: number
? Is ID field? Yes
? Required?: No
? Default value [leave blank for none]:
Let's add another property to TodoList
Enter an empty property name when done
? Enter the property name: title
? Property type: string
? Required?: Yes
? Default value [leave blank for none]:
Let's add another property to TodoList
Enter an empty property name when done
? Enter the property name: color
? Property type: string
? Required?: No
? Default value [leave blank for none]:
Let's add another property to TodoList
Enter an empty property name when done
? Enter the property name:
create src/models/todo-list.model.ts
update src/models/index.ts
Model TodoList was created in src/models/
```
Now that we have our new model, we need to define its relation with the `Todo`
model. Add the following import statements and property to the `TodoList` model:
{% include code-caption.html content="src/models/todo-list.model.ts" %}
```ts
import {hasMany} from '@loopback/repository';
import {Todo} from './todo.model';
()
export class TodoList extends Entity {
// ...properties defined by the CLI...
(() => Todo)
todos?: Todo[];
// ...constructor def...
}
```
The `()` decorator defines this property. As the decorator's name
suggests, `()` informs LoopBack 4 that a todo list can have many todo
items.
To complement `TodoList`'s relationship to `Todo`, we'll add in the `todoListId`
property on the `Todo` model to define the relation on both ends:
{% include code-caption.html content="src/models/todo.model.ts" %}
```ts
()
export class Todo extends Entity {
// ...properties defined by the CLI...
()
todoListId: number;
// ...constructor def...
}
```
Once the models have been completely configured, it's time to move on to adding
a [repository](todo-list-tutorial-repository.md) for `TodoList`.
### Navigation
Introduction: [TodoList Tutorial](todo-list-tutorial.md)
Next step: [Add TodoList repository](todo-list-tutorial-repository.md)