Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@angular-material-extensions/faq
Advanced tools
Readme
This project has been renamed from ngx-material-faq to @angular-material-extensions/faq
Do you have any question or suggestion ? Please do not hesitate to contact us! Alternatively, provide a PR | open an appropriate issue here
If you like this project, support angular-material-extensions by starring :star: and sharing it :loudspeaker:
View all the directives and components in action at https://angular-material-extensions.github.io/faq
npm i @angular/cdk @angular/material @angular/flex-layout @angular/animations @angular/forms
index.html
file like below:<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
npm i -s material-design-icons
angular.json
file"styles": [
"styles.css",
"../node_modules/material-design-icons/iconfont/material-icons.css"
],
Install above dependencies via npm.
Now install @angular-material-extensions/faq
via:
npm install -s @angular-material-extensions/faq
Note:If you are using
SystemJS
, you should adjust your configuration to point to the UMD bundle. In your systemjs config file,map
needs to tell the System loader where to look for@angular-material-extensions/faq
:
map: {
'@angular-material-extensions/faq': 'node_modules/@angular-material-extensions/faq/bundles/faq.umd.js',
}
Once installed you need to import the main module:
import { MatFaqModule } from '@angular-material-extensions/faq';
The only remaining part is to list the imported module in your application module. The exact method will be slightly
different for the root (top-level) module for which you should end up with the code similar to (notice MatFaqModule .forRoot()
):
import { MatFaqModule } from '@angular-material-extensions/faq';
@NgModule({
declarations: [AppComponent, ...],
imports: [MatFaqModule.forRoot(), ...],
bootstrap: [AppComponent]
})
export class AppModule {
}
Other modules in your application can simply import MatFaqModule
:
import { MatFaqModule } from '@angular-material-extensions/faq';
@NgModule({
declarations: [OtherComponent, ...],
imports: [MatFaqModule, ...],
})
export class OtherModule {
}
angular-material-extensions
add the mat-faq
or the mat-faq-admin
element to your template:
This component aims to list the provided frequently asked questions
<mat-faq [faqList]="list"></mat-faq>
import {Component, OnInit, ViewEncapsulation} from '@angular/core';
import {FaqItem} from '@angular-material-extensions/faq';
export class HomeComponent implements OnInit {
ngOnInit() {
}
list: FaqItem[] = [
{
question: 'Why does it think the jQuery plugin is missing?',
answer: 'Remember: load jQuery before AngularJS if you are using jQuery plugins!'
},
{
question: 'How do I access the DOM from a controller?',
answer: 'DO NOT perform DOM selection/traversal from the controller. The HTML hasn\'t rendered yet. Look up \'directives\'.'
}
];
}
This component is actually for admin purposes, like to add a frequently asked question to the backend, firebase ... and so on..
<mat-faq-admin [title]="'Admin'" (onFAQItemAdded)="onNewFaqItem($event)"></mat-faq-admin>
in your component
import {Component, OnInit, ViewEncapsulation} from '@angular/core';
import {FaqItem} from '@angular-material-extensions/faq';
export class HomeComponent implements OnInit {
ngOnInit() {
}
faq: FaqItem[] = [];
onNewFaqItem(faqItem: FaqItem) {
console.log('on new faqItem -> ', faqItem);
this.faq.splice(0, 0, faqItem);
}
}
Please checkout the full documentation here or follow the official tutorial
$ git clone https://github.com/angular-material-extensions/faq.git
$ gulp link
$ cd demo
$ npm i
$ npm run start
or
$ ng serve --open
http://localhost:4200/
npm i
$ npm run build
$ gulp link
cd demo
_ npm i
_ npm start
Built by and for developers :heart: we will help you :punch:
This project is supported by jetbrains with 1 ALL PRODUCTS PACK OS LICENSE incl. webstorm
Copyright (c) 2018 Anthony Nahas. Licensed under the MIT License (MIT)
FAQs
Angular Library built with material design in order to provide a reusable faq (frequently asked questions) component for every project. Ask, Answer and List
The npm package @angular-material-extensions/faq receives a total of 14 weekly downloads. As such, @angular-material-extensions/faq popularity was classified as not popular.
We found that @angular-material-extensions/faq demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.