material-auto-suggest-input preventing page from loading

[DanielSmith1239]

Hello,
I'm trying to show material-auto-suggest-input in my template, however when I add it, it prevents the page from loading. Here is my template:

Here is my dart code:

When I remove the material-auto-suggest-input tag, the page loads fine. Any tips?

[DanielSmith1239]

Just to clarify, no errors are printed to the console. The page simply doesn't load.

[nshahan]

That code looks very similar to the example that we know is working. When you say "the page simply doesn't load" do you mean 404 error or it loads but just looks blank? If blank, what appears in the dom? Is your angular app being loaded at all? Does your app load when it includes a smaller component like material button?

[giorgiofran]

I guess your are missing the providers definition:
providers: [materialProviders],

[DanielSmith1239]

@giorgiofran materialProviders is deprecated I believe.
@nshahan Exactly, It's copied and pasted from the example. That's why I'm so confused. I mean that the other angular components on the page don't load. I have something like <my-app>Loading...</my-app> in my index.html, and adding the material-auto-suggest-input makes it so the page only displays "Loading..." and never loads the components. I'm able to add material buttons, cards, and icons with no problem (probably more, but that's all I've tested). I was also having issues showing a stepper components, but I gave up on that when I redesigned my application.

[giorgiofran]

• materialDirectives is deprecated, not materialProviders
• As providers are inherited from the calling component, normally materialProviders is set in the top component (if you use a default project, the AppComponent) so that all components of the project will not need to define it again.
• I created a new project (Dart 2.0) with your example and it worked adding materialProviders in SearchBoxComponent or in AppComponent

[DanielSmith1239]

Adding materialProviders fixed the issue, thanks.