segue meu codigo e o erro
<section class="container criar-pensamentos ff-inter">
<header class="header">
<h2>
Adicione um <br />
pensamento novo:
</h2>
</header>
<form>
<label for="pensamento">Pensamento</label>
<input
class="input"
type="textarea"
name="pensamento"
id="pensamento"
placeholder="Digite o pensamento"
[(ngModel)]="pensamento.conteudo"
> <!-- os colchetes acima informam a passagem de dados do ts para o html, se chama property binding -->
<label for="Autoria ou fonte">Autoria</label>
<input
class="input"
type="text"
name="Autoria"
id="Autoria"
placeholder="Digite a Autoria ou fonte"
[(ngModel)]="pensamento.autoria"
>
<label for="modelo">Selecione o modelo do card:</label>
<div class="container-radio">
<div class="radio-modelo">
<label for="modelo1">
<input type="radio" id="modelo1" value="modelo1" name="modelo-card"
[(ngModel)]="pensamento.modelo"/>
<div class="custom-radio">
<span></span>
</div>
<span>Modelo 1</span>
</label>
Prévia:
<div class="modelo modelo1 ff-roboto-mono">
<img src="../../../../assets/imagens/modelo1.png" alt="aspas azuis">
<p class="conteudo">{{ pensamento.conteudo }}</p>
<p class="conteudo"><b></b>{{ pensamento.autoria }}</p>
<!-- O que for inserido dentro destas chaves duplas será considerado como uma variável e seu conteúdo, se este existir, será impresso -->
</div>
</div>
<div class="radio-modelo">
<label for=""modelo2>
<input type="radio" id="modelo1" value="modelo1" name="modelo-card"
[(ngModel)]="pensamento.modelo"/>
<div class="custom-radio">
<span></span>
</div>
<span>Modelo 2</span>
</label>
Prévia:
<div class="modelo modelo2 ff-roboto-mono">
<img src="../../../../assets/imagens/modelo2.png" alt="aspas azul claro">
<p class="conteudo">{{ pensamento.conteudo }}</p>
<p class="conteudo"><b></b>{{ pensamento.autoria }}</p>
</div>
</div>
<div class="radio-modelo">
<label for="modelo3">
<input type="radio" id="modelo1" value="modelo1" name="modelo-card"
[(ngModel)]="pensamento.modelo"/>
<div class="custom-radio">
<span></span>
</div>
<span>Modelo 3</span>
</label>
Prévia:
<div class="modelo modelo3 ff-roboto-mono">
<img src="../../../../assets/imagens/modelo3.png" alt="aspas verdes">
<p class="conteudo">{{ pensamento.conteudo }}</p>
<p class="conteudo"><b></b>{{ pensamento.autoria }}</p>
</div>
</div>
</div>
<div class="acoes">
<!--usando event binding abaixo, se cria primeiro no hrml e logo apos no ts component-->
<button (click)="criarPensamento()" class="botao">
Salvar
</button>
<button (click)="cancelarPensamento()" class="botao">
Cancelar
</button>
</div>
</form>
</section>
ts
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-criar-pensamento',
templateUrl: './criar-pensamento.component.html',
styleUrls: ['./criar-pensamento.component.css']
})
export class CriarPensamentoComponent implements OnInit{
pensamento = {
id: '1',
conteudo: 'Apendendo angular',
autoria: 'Dev',
modelo: 'modelo1'
}
constructor(){
}
criarPensamento(){
alert('aaaa')
}
cancelarPensamento(){
}
ngOnInit(): void {
}
}
erro