Angular2 : Can't bind to 'model' since it isn't a known property of 'p-steps'

can t bind to scrollbaroptions since it isn t a known property of 'div
angular directive
can t bind to since it is not provided by any applicable directives
custom directives in angular 2
can't bind to since it isn't a known property of 'ng-container'.
mandatory parameter in components angular 2
can t bind to select' since it isn t a known property of ng-content
property is not provided by any applicable directives

I have been trying to execute the following code:

states.component.html

<p-steps [model]="items"></p-steps>

import { Component, OnInit } from '@angular/core';

import { StepsModule, MenuItem } from 'primeng/primeng';

import { NgModule } from '@angular/core';

@Component({
  selector: 'jhi-states',
  templateUrl: './states.component.html',
  styles: []
})

states.component.ts

export class StatesComponent implements OnInit {

  items: MenuItem[];

  constructor() { }

  ngOnInit() {
        this.items = [
            {label: 'Step 1'},
            {label: 'Step 2'},
            {label: 'Step 3'}
        ];
  }

}

when connecting to the website I obtain the following results :

  • Can't bind to 'model' since it isn't a known property of 'p-steps'.

Any idea ??

I see you have imported the module into your component, but have you imported the PrimeNG StepsModule into your parent module?

import { StepsModule } from 'primeng/primeng';

@NgModule({
  imports: [
    StepsModule
  ],

Angular 2 Components and Providers: Classes, Factories & Values , Let's see how we can add a provider to a component by creating a class provider using MyClass , a simple class that will generate the instance� Build features quickly with simple, declarative templates. Extend the template language with your own components and use a wide array of existing components. Get immediate Angular-specific help and feedback with nearly every IDE and editor. All this comes together so you can focus on building amazing apps rather than trying to make the code work.

Did you had it to your imports in your xxxx.spec.ts file too? I had the same issue with MenuBarModule. I just added it to my component.spec.ts like this

 TestBed.configureTestingModule({
        imports: [MenubarModule],
        declarations: [ HeadComponent]
    })

Angular 2 - Components, Example � We are defining a class called AppComponent. � The export keyword is used so that the component can be used in other modules in the Angular JS� The export keyword is used so that the component can be used in other modules in the Angular JS application. appTitle is the name of the property. The property is given the type of string. The property is given a value of ‘Welcome’. Template. This is the view which needs to be rendered in the application. Syntax

Angular 2 vs React: The Ultimate Dance Off, Since TypeScript can compile working builds even when there are errors, it's possible, perhaps likely, that large projects will get into that situation� Angular (commonly referred to as "Angular 2+" or "Angular v2 and above") is a TypeScript-based open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations.

AngularJS to Angular2(V4): A basic example, While Angular2 can be built with Javascript, it was developed with Typescript in mind; most documentation and information assumes you will be� Angular2 RC5: Can't bind to 'Property X' since it isn't a known property of 'Child Component' 835. Can't bind to 'formGroup' since it isn't a known property of 'form' 86.

Find Out How to Debug Angular 2 Applications, Get a comprehensive overview in this tutorial of the various ways you can debug an Angular 2 applications using the Google Chrome� We can directly use ngIf with template directive or <template> tag in place of asterisk (*) in our code if we want. Angular 4 NgIf-Then-Else Angular 4 has introduced NgIf with then and else. If condition in NgIf is false and it is necessary to show a template then we use else and its binding point is <ng-template>.

Introduction to the Angular Docs, using TypeScript. Most Angular code can be written with just the latest JavaScript, using types for dependency injection, and using decorators for metadata. Only then can it be bound by some other component or directive. You can tell if @Input is needed by the position of the property name in a binding. When it appears in the template expression to the right of the equals (=), it belongs to the template's component and does not require the @Input decorator.

Comments