Interview Questions.

Question 1. What Is Angular Material?

Answer :

Angular Material is a UI thing library for Angular JS builders. Angular Material's reusable UI components allows in constructing appealing, constant, and functional net pages and net apps while adhering to trendy internet layout ideas like browser portability, device independence, and sleek degradation.

Some of its salient capabilities are as follows:

In-built responsive designing.
Standard CSS with minimal footprint.
Includes new variations of common consumer interface controls along with buttons, take a look at containers, and textual content fields which are adapted to observe Material Design ideas.
Includes superior and specialized features like cards, toolbar, speed dial, aspect nav, swipe, and so on.
Cross-browser, and may be used to create reusable internet components.
Free to apply
Question 2. How To Use Angular Material?

Answer :

There are two methods to use Angular Material:

Local Installation - You can download the Angular Material libraries the usage of npm, jspm, or bower in your local system and encompass it in your HTML code.
CDN Based Version - You can include the angular-fabric.Min.Css and angular-material js files into your HTML code at once from the Content Delivery Network (CDN).
PHP Interview Questions
Question three. What Is Local Installation?

Answer :

Use following npm instructions to put in Angular Material libraries

npm install angular-material

npm will down load the files under node_modules > angular-material folder.

Question 4. What Is Cdn Based Version?

Answer :

You can include the angular-material.Css and angular-fabric.Js files into your HTML code directly from the Content Delivery Network (CDN). Google CDN affords content for the brand new model.

PHP Tutorial
Question 5. What Is Angular Material Autocomplete?

Answer :

md-autocomplete, an Angular Directive, is used as a special input manipulate with an inbuilt drop-down to show all viable matches to a custom query. This manage acts as a actual-time idea field as soon because the user types within the input area. Can be used to provide search outcomes from nearby or far flung facts resources.Md-autocomplete caches outcomes when appearing a question. After first name, it makes use of the cached consequences to eliminate useless server requests or lookup good judgment and it may be disabled.

Attributes

* md-objects: An expression inside the layout of item in items to iterate over matches on your search.
Md-selected-object-change: An expression to be run whenever a new object is chosen.
Md-seek-text-trade: An expression to be run on every occasion the search text updates.
Md-seek-textual content: A version to bind the search question textual content to.
Md-selected-item: A model to bind the selected object to.
Md-object-textual content: An expression so as to convert your object to a unmarried string.
Placeholder: Placeholder text so as to be forwarded to the enter.
Md-no-cache: Disables the inner caching that takes place in autocomplete.
Ng-disabled: Determines whether or not or no longer to disable the input discipline.
Md-min-period: Specifies the minimum length of text before autocomplete will make guidelines.
Angular JS Interview Questions
Question 6. What Is Angular Material Bottom Sheet?

Answer :

$mdBottomSheet, an Angular Service, is used to open a bottom sheet over the utility and gives a simple promise API.

Methods: templateUrl - string=: The url of an html template document that will be used because the content of the lowest sheet. Restrictions: the template should have an outer md-bottom-sheet element.

Template - string=: Same as templateUrl, besides that is an actual template string.

Scope - object=: the scope to link the template / controller to. If none is exact, it will create a brand new infant scope. This scope could be destroyed whilst the lowest sheet is removed unless preserveScope is ready to genuine.

PreserveScope - boolean=: whether or not to hold the scope while the element is eliminated. Default is false.

Controller - string=: The controller to accomplice with this backside sheet.

Locals - string=: An item containing key/fee pairs. The keys will be used as names of values to inject into the controller. For example, locals: three: three might inject three into the controller with the price of 3.

ClickOutsideToClose - boolean=: Whether the person can click on outside the lowest sheet to shut it. Default authentic.

EscapeToClose - boolean=: Whether the user can press get away to shut the bottom sheet. Default proper.

Solve - object=: Similar to locals, except it takes promises as values and the lowest sheet will now not open until the promises remedy.

ControllerAs - string=: An alias to assign the controller to at the scope.

Discern - detail=: The element to append the bottom sheet to. The determine may be a feature, string, item, or null. Defaults to appending to the body of the root element (or the foundation element) of the application. E.G. Angular.Element(record.GetElementById('content material')) or "#content material".

DisableParentScroll - boolean=: Whether to disable scrolling while the bottom sheet is open. Default actual.

Question 7. What Is Angular Material Buttons?

Answer :

md-button, an Angular Directive, is a button directive having non-obligatory ink ripples (and are via default enabled). If href or ng-href attribute is furnished, then this directive acts as an anchor element.

Attributes

md-no-ink: If set as proper, disable ripple ink consequences.
Ng-disabled: Enable/Disable primarily based on the expression.
Md-ripple-length: Overrides the default ripple size common sense. Options: full, partial, car.
Aria-label: Adds alternative textual content to button for accessibility, beneficial for icon buttons. If no default text is found, a caution might be logged.
Ext JS Tutorial Ext JS Interview Questions
Question 8. What Is Angular Material Cards?

Answer :

md-card, an Angular Directive, is a field directive and is used to attract cards in angularjs application. Following are the angular directives and instructions utilized in md-card.

<md-card-header>: Header for the cardboard, holds avatar, textual content and squared photo.
<md-card-avatar>: Card avatar.
Md-person-avatar: Class for person photograph.
<md-icon>: Icon directive.
<md-card-header-text> : Contains factors for the cardboard description.
Md-name: Class for the card identify.
Md-subhead: Class for the cardboard sub header.
<img>: Image for the cardboard.
<md-card-title>: Card content material identify.
<md-card-title-text>: Card Title textual content field.
Question 9. What Is Angular Material Checkboxes?

Answer :

md-checkbox, an Angular Directive, is used as a checkbox control.

Attributes

* ng-model: Assignable angular expression to statistics-bind to.
Name: Property call of the shape underneath which the manage is posted.
Ng-proper-cost: The cost to which the expression need to be set while selected.
Ng-fake-cost: The fee to which the expression need to be set while not decided on.
Ng-change: Angular expression to be completed whilst input modifications due to user interaction with the enter element.
Md-no-ink: Use of characteristic indicates use of ripple ink consequences.
Aria-label: Adds label to checkbox for accessibility. Defaults to checkbox's textual content. If no default text is observed, a warning can be logged.
Django Interview Questions
Question 10. What Is Angular Material Chips?

Answer :

md-chips, an Angular Directive, is used as a special factor known as Chip and may be used to symbolize small set of data for example, a touch, tags and many others. Custom template may be used render the content of a chip. This may be achieved via specifying an md-chip-template detail having the custom content material as a toddler of md-chips.

Attributes

* ng-version: Assignable angular expression to information-bind to.
* ng-model: A model to bind the list of items to.
* md-transform-chip: An expression of form myFunction($chip) that once called expects one of the following return values:
->an item representing the $chip input string.
->undefined to virtually add the $chip enter string, or.
->null to prevent the chip from being appended.
* md-require-in shape: If proper, and the chips template carries an autocomplete, best permit selection of pre-defined chips (i.E. You can not add new ones).
Placeholder: Placeholder text so as to be forwarded to the input.
Secondary-placeholder: Placeholder textual content in order to be forwarded to the enter, displayed when there may be at the least on item within the listing.
Readonly: Disables list manipulation (deleting or adding list gadgets), hiding the enter and delete buttons.
Md-on-add: An expression in order to be known as while a chip has been added.
Md-on-get rid of: An expression so that you can be called when a chip has been removed.
Md-on-select: An expression so that it will be known as whilst a chip is chosen.
Django Tutorial
Question eleven. What Is Angular Material Contact Chips?

Answer :

md-contact-chips, an Angular Directive, is an input manage built on md-chips and makes use of md-autocomplete detail. The contact chip issue accepts a question expression which returns a list of possible contacts. The user can select this sort of and upload it to the list of availble chips.

Attributes

* ng-model: A model to bind the listing of objects to.
* md-contacts: An expression predicted to go back contacts matching the search take a look at, $question.
* md-touch-call: The subject call of the contact object representing the touch's name.
* md-contact-electronic mail: The discipline name of the touch object representing the contact's e mail address.
* md-touch-picture: The subject name of the touch item representing the touch's photograph.
Placeholder: laceholder text as a way to be forwarded to the input.
Secondary-placeholder: Placeholder text so one can be forwarded to the input, displayed while there is as a minimum on item inside the list.
Clear out-decided on: Whether to filter decided on contacts from the listing of recommendations shown within the autocomplete.
Java Abstraction Interview Questions
Question 12. What Is Angular Material Content?

Answer :

md-content, an Angular Directive, is a box element and is used for scrollable content material. Format-padding characteristic can be brought have padded content material.

PHP Interview Questions
Question thirteen. What Is Angular Material Datepicker?

Answer :

md-datepicker, an Angular Directive, is an enter manipulate to choose a date and supports ngMessages for enter validation.

Attributes

* ng-version: The factor's version. Expects a JavaScript Date item.
Ng-alternate: Expression evaluated whilst the model fee changes.
Md-min-date: Expression representing a min date (inclusive).
Md-max-date: Expression representing a max date (inclusive).
Md-date-filter out: Function anticipating a date and returning a boolean whether it is able to be selected or now not.
Md-placeholder: The date enter placeholder price.
Ng-disabled: Whether the datepicker is disabled.
Ng-required: Whether a price is needed for the datepicker.
Angular 2 Tutorial
Question 14. What Is Angular Material Dialogs?

Answer :

md-conversation, an Angular Directive, is a box detail and is used to display a conversation box. Its element md-dialog-content material contains the content of the dialog and md-dialog-movements is answerable for dialog actions.

MdDialog, an Angular Service, opens a conversation over the software to tell customers approximately the information or require them to make choices.

Question 15. What Is Angular Material Divider?

Answer :

md-divider, an Angular Directive, is a rule detail and is used to display a thin lightweight rule to institution and divide contents inside lists and web page layouts.

Attributes

md-inset: Add this characteristic to prompt the inset divider fashion.

Angular 2 Interview Questions
Question 16. What Is Angular Material Fab Speed Dial?

Answer :

The md-fab-speed-dial an Angular directive, is used to show a sequence of popup elements or buttons for short get admission to to not unusual actions.

Attributes

* md-course: From which route you would really like the rate dial to seem relative to the cause detail.
Md-open: Programmatically control whether or not or not the speed-dial is seen.
Phonegap Tutorial
Question 17. What Is Angular Material Fab Toolbars?

Answer :

The md-fab-toolbar an Angular directive, is used to reveal a toolbar of factors or buttons for brief get entry to to not unusual movements.

Attributes

* md-path: From which direction you would really like the toolbar items to seem relative to the cause detail. Supports left and right guidelines.
Md-open: Programmatically manipulate whether or not or now not the toolbar is visible.
Phonegap Interview Questions
Question 18. What Is Angular Material Grids?

Answer :

The md-grid-list an Angular directive, is part for laying out content for various screen sizes. A grid has 12 columns inside the computer length screen, eight within the pill size display, and four inside the telephone length screen, where every length have predefined margins and gutters. Cells are specified in sequential way in a row, within the order they're described.

Attributes

* md-cols: Number of columns within the grid.
* md-row-top: One of
->CSS length - Fixed peak rows (eg. 8px or 1rem).
->width:height - Ratio of width to top (eg. Md-row-top="sixteen:nine").
->"fit" - Height can be determined by subdividing the to be had height by means of the wide variety of rows.
Md-gutter: The amount of area between tiles in CSS devices (default 1px).
Md-on-layout: Expression to evaluate after layout. Event item is available as $event, and incorporates overall performance facts.
Angular JS Interview Questions
Question 19. What Is Angular Material Icons?

Answer :

The md-icon an Angular directive, is a component to show vector-based totally icons in software. It supports icon fonts and SVG icons also aside from using Google Material Icons.

Attributes

* md-font-icon: String name of CSS icon associated with the font-face will be used to render the icon. Requires the fonts and the named CSS patterns to be preloaded.
* md-font-set: CSS fashion call related to the font library; with the intention to be assigned because the magnificence for the font-icon ligature. This price can also be an alias that is used to lookup the classname; internally use $mdIconProvider.FontSet(<alias>) to determine the fashion name.
* md-svg-src: String URL (or expression) used to load, cache, and display an external SVG.
* md-svg-icon: md-svg-icon String call used for lookup of the icon from the inner cache; interpolated strings or expressions can also be used. Specific set names can be used with the syntax <set name>:<icon name>. To use icon sets, developers are required to pre-sign up the sets the usage of the $mdIconProvider service.
Aria-label: Labels icon for accessibility. If an empty string is supplied, icon may be hidden from accessibility layer with aria-hidden="actual". If there is no aria-label on the icon nor a label on the figure element, a caution will be logged to the console.
Alt: Labels icon for accessibility. If an empty string is provided, icon will be hidden from accessibility layer with aria-hidden="proper". If there is no alt at the icon nor a label on the determine detail, a warning could be logged to the console.
MongoDB Tutorial
Question 20. What Is Angular Material Inputs?

Answer :

The md-enter-field an Angular directive, is a container element to carries any <input> or <textarea> element as a infant. Md-input-box additionally supports mistakes managing the use of the standard ng-messages directives and animates the messages the use of ngEnter/ngLeave activities or the ngShow/ngHide occasions.

Attributes

md-maxlength: The maximum quantity of characters allowed on this enter. If that is designated, a man or woman counter may be proven below the input. The cause of md-maxlength is exactly to expose the max period counter textual content. If you do not want the counter text and most effective need "simple" validation, you may use the "simple" ng-maxlength or maxlength attributes.
Aria-label: Aria-label is required whilst no label is gift. A warning message might be logged inside the console if not gift.
Placeholder: An opportunity technique to the use of aria-label while the label is not PRESENT. The placeholder text is copied to the aria-label attribute.
Md-no-autogrow: When gift, textareas will no longer grow mechanically.
Md-detect-hidden: When present, textareas might be sized properly while they may be revealed after being hidden. This is off through default for performance reasons as it guarantees a reflow each digest cycle.
MongoDB Interview Questions
Question 21. What Is Angular Material Layouts?

Answer :

Layout Directive

format directive on a box detail is used to specify the format course for its kids. Following are the assignable values:

row - Items are organized horizontally with max-top = a hundred% and max-width is the width of the gadgets inside the container.

Column - Items are organized vertically with max-width = a hundred% and max-peak is the peak of the items in the field.

For responsive design together with format to be routinely changed relying upon the device display length,following format APIs can be used to set the format path for devices with view widths.

Format:  Sets default format path unless overridden via any other breakpoint.
Layout-xs:   width < 600px
layout-gt-xs:   width >= 600px
format-sm:   600px <= width < 960px
layout-gt-sm:   width >= 960px
layout-md:   960px <= width < 1280px
layout-gt-md:   width >= 1280px
format-lg:   1280px <= width < 1920px
layout-gt-lg:   width >= 1920px
layout-xl:    width >= 1920px
Question 22. What Is Flex Directive?

Answer :

flex directive on a box element is used to personalize the size and function of elements. Flex directive defines the way how the detail is to modify its length with appreciate to its parent container and the opposite factors in the box.Following are the assignable values:

multiples of 5 - 5, 10, 15 ... One hundred
33 - 33%
sixty six - 66%

Question 23. What Is Angular Material List?

Answer :

The md-list an Angular directive, is a container factor to incorporates md-list-object factors as a youngsters. The md-list-object directive is a container factor for row objects of md-list box. CSS training md-2-line and md-three-line may be brought to md-listing-item to increase the height of row with 22px and 40px respectively.

Angular five Interview Questions
Question 24. What Is Angular Material Menu?

Answer :

The md-menu an Angular directive, is a component to display addition alternatives in the context of movement carried out. Md-menu have  child elements. First one is cause detail and is used to open the menu. Second element is md-menu-content material to symbolize the content of the menu while menu is opened. Md-menu-content material generally contains menu objects as md-menu-object.

Attributes

* md-function-mode:   The function mode in the form of x, y. Default price is goal,target. Right now the x axis additionally suppports goal-right.
* md-offset:   An offset to apply to the dropdown after positioning x, y. Default fee is 0,zero.
Ext JS Interview Questions
Question 25. What Is Angular Material Menu Bar?

Answer :

The md-menu-bar an Angular directive, is a box aspect to preserve multiple menus. Menu bar facilitates to create a operating device furnished menu impact.

Question 26. What Is Angular Material Progress Bars?

Answer :

The md-progress-round and md-development-linear are Angular development directives, and are used to expose loading content material message in software.

Attributes - md-development-round

* md-mode: Select from one of two modes: 'determinate' and 'indeterminate'. If the md-mode fee is set as undefined or particular as not 1 of the 2 (2) valid modes, then .Ng-disguise can be automobile-carried out as a style to the element. If no longer configured, the md-mode="indeterminate" might be car injected as an characteristic. If cost="" is likewise exact, however, then md-mode="determinate" would be auto-injected alternatively.
Cost: In determinate mode, this variety represents the share of the round development. Default: 0
md-diameter: This specifies the diamter of the circular development. The value may be a percent (eg '25%') or a pixel-size cost (eg '48'). If this characteristic is not gift then a default price of '48px' is believed.
Angular four Interview Questions
Question 27. What Is Angular Material Radio Buttons?

Answer :

The md-radio-institution and md-radio-button Angular directives are used to show radio buttons inside the applcation. Md-radio-organization is the grouping field for md-radio-button factors.

Attributes - md-radio-institution

* ng-version: Assignable angular expression to statistics-bind to.
Md-no-ink: Use of attribute suggests flag to disable ink ripple consequences.
Attributes - md-radio-button

* ng-version: Assignable angular expression to facts-bind to.
* ngValue: Angular expression which units the cost to which the expression should be set while selected.
* cost: The price to which the expression must be set whilst decided on.
NgChange: Angular expression to be executed when enter modifications due to person interplay with the enter detail.
Name: Property name of the shape under which the control is published.
Aria-label: Adds label to radio button for accessibility. Defaults to radio button's text. If no text content material is to be had, a caution could be logged.
Django Interview Questions
Question 28. What Is Angular Material Selects?

Answer :

The md-choose, an Angular directives is used to show Select container, bounded through ng-version.

Attributes - md-radio-institution

* ng-model: The version!
More than one: Whether it's multiple.
Md-on-near: Expression to be evaluated whilst the select is closed.
Placeholder: Placeholder hint textual content.
Optional label for accessibility. Only essential if no placeholder or explicit label is present.
Md-field-magnificence: Class listing to get carried out to the .Md-select-menu-box detail (for custom styling).
Question 29. What Is Angular Material Sidenav?

Answer :

The md-sidenav, an Angular directives is used to expose a box component which can be proven or cover programmatically. It slides out over the top of the primary content material region through default.

Attributes

md-is-open: A version bound to whether or not the sidenav is opened.
Md-issue-identification: componentId to use with $mdSidenav provider.
Md-is-locked-open: When this expression evalutes to actual, the sidenav 'locks open': it falls into the content material's glide in preference to acting over it. This overrides the is-open attribute. The $mdMedia() provider is exposed to the is-locked-open attribute, which may be given a media question or one of the sm, gt-sm, md, gt-md, lg or gt-lg presets. Examples:

<md-sidenav md-is-locked-open="shouldLockOpen"></md-sidenav>

<md-sidenav md-is-locked-open="$mdMedia('min-width: 1000px')"></md-sidenav>

<md-sidenav md-is-locked-open="$mdMedia('sm')"></md-sidenav> (locks open on small screens)
Angular 6 Interview Questions
Question 30. What Is Angular Material Sliders?

Answer :

The md-slider, an Angular directives is used to show a range component. It has  modes:

normal - User can slide between extensive variety of values. Default.
Discrete - User can slide among selected values. To allow discrete mode use md-discrete and step attributes.
Attributes

md-discrete: Whether to permit discrete mode.
Step: The distance among values the user is allowed to pick. Default 1.
Min: The minimal price the user is allowed to select. Default 0.
Max: The most price the user is permitted to pick. Default 100.