When I try to compile my code, I get the following error
ERROR in MatTooltipModule is not an NgModule
My app module imports look like this
import {MatSliderModule, MatTooltipModule} from '#angular/material';
imports: [
MatTooltipModule,
MatSliderModule,
],
Why am I getting this error?
Try this:
import {MatSliderModule} from '#angular/material/slider';
Related
I have this sample: https://stackblitz.com/edit/partehoras?file=src/styles.css
Where I have installed angular material
I have created this material.module where I export all the modules needed
Then I import this module in app.module
In styles.scss i have imported one
#import '#angular/material/prebuilt-themes/indigo-pink.css';
But when I try this in my template
<mat-card>
......
<mat-card>
I get this error
Any idea, please?
Thanks
ListadoEmpleadosComponent is missing from the list of declarations in app module and you also need to import HttpClientModule
declarations: [ AppComponent, ListadoEmpleadosComponent ]
I am new to Angular Dart. I have installed Dart, and added dart plugin in VS code. Then I created a bare bone project thru VS command pallette. But when I added this line in main.dart, I got build error. It is as recommended by angular dart i.e
angular dart
Here is my main.dart file.
import 'dart:html';
import 'package:angular/angular.dart';
import 'package:angular_web_application/app_component.dart' as ng;
import 'package:http/browser_client.dart';
#GenerateInjector([
ClassProvider(Client, useClass: BrowserClient),
])
void main() {
runApp(ng.AppComponentNgFactory);
}
Here is my app_component.dart
import 'package:angular/angular.dart';
#Component(
selector: 'my-app',
template: '<h1>Hello {{name}}</h1>',
)
class AppComponent {
var name = 'Angular';
}
In my index.html, I have this line
<my-app>Loading</my-app>
But I am facing build error for the line
runApp(ng.AppComponentNgFactory);
I get this error:
"message": "The name 'AppComponentNgFactory' is being referenced through the prefix 'ng', but it isn't defined in any of the libraries imported using that prefix.\nTry correcting the prefix or importing the library that defines 'AppComponentNgFactory'.
The factory is not declared in the app_component.dart.
It is generated by Angular compiler
import 'package:angular_web_application/app_component.template.dart' as ng;
Which should have the right implementation.
See What does somecomponent.template.dart import in AngularDart point to? for example.
i am new to Angular and i have encountered a blank web page and the following error despite my application compiling successfully.
ERROR in src/app/app.module.ts:7:129 - error TS2306: File 'C:/Users/----------/news-app/node_modules/#angular/material/index.d.ts'
is not a module.
7 import { MatButtonModule, MatCardModule, MatMenuModule, MatToolbarModule, MatIconModule, MatSidenavModule, MatListModule } from '#angular/material';
In Angualar 9 material components can no longer be imported from #angular/material.
Use the individual secondary entry-points, such as #angular/material/button for MatButtonModule
https://github.com/angular/components/issues/17503
I just started a new ruby on rails app with react using the webpacker gem. Im also using material-ui and eslint-config-airbnb. After running the linter Im getting this error:
Missing file extension "css" for "typeface-roboto" import/extensions.
eslintrc.json
module.exports = {
"extends": "airbnb",
"env": {
"browser": true,
},
};
index.jsx
import 'typeface-roboto'; // this is the import causing the issue
import React from 'react';
import ReactDOM from 'react-dom';
import Application from './app';
ReactDOM.render(<Application />, document.getElementById('root'));
Not sure why this is happening either, but you could try disabling the line for eslint:
import 'typeface-roboto'; // eslint-disable-line
I tried to use the router in angular2-beta.20 in Dart with the HashLocationStrategy.
But I couldn't find any docs, except for
this link to angular2-beta.15 docs, which are incomplete.
The example shows TypeScript imports instead of Dart ones.
So I tried to import package:angular2/router.dart, but the Dart Analyzer keeps complaining that it can not find LocationStrategy and HashLocationStrategy
Also I don't know, how to write the import exactly, because a top-level provide function, as in the example above, seems non existent.
provide(LocationStrategy, {useClass: HashLocationStrategy})
After some research I found the following:
LocationStrategy and HashLocationStrategy are now part of
package:angular2/platform/common.dart instead of package:angular2/router.dart.
The bootstrap()- method is platform specific, so we need to import package:angular2/platform/browser.dart.
We need to import package:angular2/router.dart to have ROUTER_PROVIDERS available in bootstrap() method.
Here is a working code example for the dart file initializing :
// needed to import "bootstrap" method
import 'package:angular2/platform/browser.dart';
// needed to import LocationStrategy and HashLocationStrategy
import 'package:angular2/platform/common.dart';
// needed for Provider class
import 'package:angular2/angular2.dart';
// needed to import ROUTER_PROVIDERS
import 'package:angular2/router.dart';
// import your app_component as root component for angular2
import 'app_component.dart';
void main() {
bootstrap(AppComponent, [
ROUTER_PROVIDERS,
const Provider(LocationStrategy, useClass: HashLocationStrategy)
]);
}
Hope this helps somebody! :)