Angular 6 - @input не работает

Я написал простое угловое приложение для изучения @input для связи между компонентами, но значение не передается. Я также читал некоторые форумы, которые сталкивались с подобными проблемами, но ни одно из предписанных решений не работает для меня. Пожалуйста, руководство.

app.componenent.html

<app-task [prioirty]="'p1'"></app-task>

task.component.ts

import { Component, OnInit, Input } from '@angular/core';
import { Task } from 'src/app/task/task';
import { TaskService } from 'src/app/task/services/task.service';
import {AppComponent} from 'src/app/app.component'

@Component({
  selector: 'app-task',
  templateUrl: './task.component.html',
  styleUrls: ['./task.component.css'],
})
export class TaskComponent implements OnInit {     
  constructor(private taskService: TaskService) {        
  }      
  task: Task = new Task();
  @Input() priortiy: string; 
  ngOnInit() {
  }
  addTask(){
    alert(this.priortiy);
    this.taskService.addTask(this.task).subscribe((data : Task) => {}, error => console.error(error),() => console.log("Job Added successfully"));    
  }    
}

Когда я пытаюсь отобразить значение приоритета в окне предупреждения, я получаю значение как неопределенное.

Дайте мне знать, если кто-нибудь захочет, чтобы я разместил полный код.

1 ответ

Решение

У вас есть опечатка,

Меняться от

 @Input() priortiy: string; 

к

 @Input() prioirty: string; 

и предупредить тоже

alert(this.prioirty);

У вас есть опечатка в вашем коде.

Проверьте свои @Input() priortiy: string; имя переменной.

Другие вопросы по тегам