BuyLog In
Ticket T660061
Visible to All Users

dx-button' is not a known element

created 7 years ago

OK - I suspect this is possibly something to do with Ionic 4, but I am not sure. I have followed the video and associated blog information from
https://www.youtube.com/watch?v=JseTvAObEmA&feature=youtu.be
https://community.devexpress.com/blogs/paulu/archive/2018/05/17/getting-started-with-devextreme-angular-amp-ionic.aspx

When I get to the introducction of the the dx-button at about 30m in on the video, the code throws and error per below. I have followed the instruction exactly except in creating the project where I specified

JavaScript
ionic start cpMobile sidemenu --type=angular

I added the type specification which I cannot see would make a difference - I figured it may be useful as Ionic 4 moves away from its absolute dependency on Angular

and checked against the devex instructions here
https://js.devexpress.com/Documentation/Guide/Getting_Started/Widget_Basics_-_Angular/Create_and_Configure_a_Widget/I have done nothing except create the project using the default Ionic templates - thought they have recently moved to v4. Could you please advise what is wrong? Project is attached. I removed the node modules to make it a reasonable size

JavaScript
vendor.js:32928 ERROR Error: Uncaught (in promise): Error: Template parse errors:  
'dx-button' is not a known element:  
1. If 'dx-button' is an Angular component, then verify that it is part of this module.  
2. If 'dx-button' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("  

<ion-content padding>  
  [ERROR ->]<dx-button text="Hi" type="default" (onclick)="sayhello" ></dx-button>  
  The world is your oyster.  
  "): ng:///HomePageModule/HomePage.html@12:2  
Error: Template parse errors:  
'dx-button' is not a known element:  
1. If 'dx-button' is an Angular component, then verify that it is part of this module.  
2. If 'dx-button' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("  

<ion-content padding>  
  [ERROR ->]<dx-button text="Hi" type="default" (onclick)="sayhello" ></dx-button>  
  The world is your oyster.  
  "): ng:///HomePageModule/HomePage.html@12:2  
    at syntaxError (vendor.js:8054)  
    at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (vendor.js:22526)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (vendor.js:30526)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (vendor.js:30513)  
    at vendor.js:30456  
    at Set.forEach (<anonymous>)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (vendor.js:30456)  
    at vendor.js:30366  
    at Object.then (vendor.js:8045)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (vendor.js:30365)  
    at syntaxError (vendor.js:8054)  
    at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (vendor.js:22526)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (vendor.js:30526)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (vendor.js:30513)  
    at vendor.js:30456  
    at Set.forEach (<anonymous>)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (vendor.js:30456)  
    at vendor.js:30366  
    at Object.then (vendor.js:8045)  
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (vendor.js:30365)  
    at resolvePromise (polyfills.js:3136)  
    at resolvePromise (polyfills.js:3093)  
    at polyfills.js:3195  
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (polyfills.js:2743)  
    at Object.onInvokeTask (vendor.js:35046)  
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (polyfills.js:2742)  
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (polyfills.js:2510)  
    at drainMicroTaskQueue (polyfills.js:2917)
Sign in to comment on this post

Answers approved by DevExpress Support

created 7 years ago (modified 7 years ago)

Had to be in home.module.ts, not app.module.ts

    Comments (1)
    Alessandro (DevExpress Support) 7 years ago

      Hi,

      It is good news that the problem has been resolved. Thank you for letting us know about your progress. Please feel free to contact us if you have any further difficulties. We will be happy to assist you.

      Sign in to comment on this post

      Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

      Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.