Fixed Button Error in Collapse

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: Fixed Button Error in Collapse

Ignacio Mariano Chiodo pro asked 7 years ago

Hi ! I just copied this from the documentation for Buttons: <div class="fixed_collapse" [mdbCollapse]="isCollapsed" #fixed="bs-collapse"> <a class="btn-floating red waves-light"mdbRippleRadius><i class="fa fa-star"></i></a> <a class="btn-floating yellow darken-1 waves-light"mdbRippleRadius><i class="fa fa-user"></i></a> <a class="btn-floating green waves-light"mdbRippleRadius><i class="fa fa-envelope"></i></a> <a class="btn-floating blue waves-light"mdbRippleRadius><i class="fa fa-shopping-cart"></i></a> </div> And i'm getting this error: Uncaught Error: Template parse errors: Can't bind to 'mdbCollapse' since it isn't a known property of 'div'. (" </a> <div class="fixed_collapse" [ERROR ->][mdbCollapse]="isCollapsed" #fixed="bs-collapse"> <a class="btn-floating red waves-light"") I can't find anything that works on the support page, anyone knows what i'm doing wrong, maybe i have to import something extra to use the fixed buttons, or maybe the documentation is not updated. Thank you!

Damian Gemza staff answered 7 years ago

Dear Ignacio, You have to read our documentation carefully and copy all sample codes that we've provide for users :) Please copy whole code from below, and it should works fine. 
<div class="fixed-action-btn" style="bottom: 45px; right: 24px;">

<a class="btn-floating btn-large red waves-light"mdbRippleRadius (click)="fixed.toggle()">

<i class="fa fa-pencil"></i>

</a>

<div class="fixed_collapse" [mdbCollapse]="isCollapsed" #fixed="bs-collapse">

<a class="btn-floating red waves-light"mdbRippleRadius><i class="fa fa-star"></i></a>

<a class="btn-floating yellow darken-1 waves-light"mdbRippleRadius><i class="fa fa-user"></i></a>

<a class="btn-floating green waves-light"mdbRippleRadius><i class="fa fa-envelope"></i></a>

<a class="btn-floating blue waves-light"mdbRippleRadius><i class="fa fa-shopping-cart"></i></a>

</div>

</div>
Best Regards, Damian

Ignacio Mariano Chiodo pro commented 7 years ago

Hey, thank you for answering me! Unfortunately it didn't work... I copied the code as you told me and i'm still getting an error: compiler.js:485 Uncaught Error: Template parse errors: Can't bind to 'mdbCollapse' since it isn't a known property of 'div'. (" ][mdbCollapse]="isCollapsed" #fixed="bs-collapse"> <a class="btn-floating red waves-light"): ng:///ProductModule/ProductListComponent.html@86:32 at syntaxError (compiler.js:485) at TemplateParser.webpackJsonp.../../../compiler/esm5/compiler.js.TemplateParser.parse (compiler.js:24660) at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._parseTemplate (compiler.js:34471) at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._compileTemplate (compiler.js:34446) at compiler.js:34347 at Set.forEach () at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._compileComponents (compiler.js:34347) at compiler.js:34217 at Object.then (compiler.js:474) at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:34216)

Damian Gemza staff commented 7 years ago

Dear Ignacio, please provide me your's package.json, whats your's environment and other settings? The fastest way to solve your's problem - send me your's project @ d.gemza@mdbootstrap.com Best Regards, Damian

shawn05 pro answered 7 years ago

Hi, I got the same error with the sample code from the documentation : " Can't bind to 'mdbCollapse' since it isn't a known property of 'div..." Did you find anything ? Thanks ! 
<div class="fixed-action-btn" style="bottom: 45px; right: 24px;">

    <a class="btn-floating btn-large red waves-light" mdbRippleRadius (click)="fixed.toggle()">
        <i class="fa fa-pencil"></i>
    </a>

    <div class="fixed_collapse" [mdbCollapse]="isCollapsed" #fixed="bs-collapse">
        <a class="btn-floating red waves-light" mdbRippleRadius><i class="fa fa-star"></i></a>
        <a class="btn-floating yellow darken-1 waves-light" mdbRippleRadius><i class="fa fa-user"></i></a>
        <a class="btn-floating green waves-light" mdbRippleRadius><i class="fa fa-envelope"></i></a>
        <a class="btn-floating blue waves-light" mdbRippleRadius><i class="fa fa-shopping-cart"></i></a>
    </div>

</div>

Dawid Adach pro answered 7 years ago

Dear shawn05, please follow our 5 min quick start, and do not forget to include 
schemas: [ NO_ERRORS_SCHEMA ]
 into your app.module.ts

shawn05 pro commented 7 years ago

Thank you Dawid I was missing the schemas: [ NO_ERRORS_SCHEMA ] !

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Closed

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
Ignacio Mariano Chiodo
Pro User
15Support score
5Questions 1Answers
0Snippets likes 0Snippets