Showing posts with label angularjs. Show all posts
Showing posts with label angularjs. Show all posts

Multiple Choice Questions - Angular 4 Animations

Multiple Choice Questions - Angular 4 Animations

Angular's animation system lets you build animations that run with the same kind of native performance found in pure CSS animations. You can also tightly integrate your animation logic with the rest of your application code, for ease of control.
Angular animations are built on top of the standard Web Animations API and run natively on browsers that support it. [Via]

Answer the below quiz questions on Angular Animations and check your knowledge on the topic.

1. To make your applications ready for animations, you must include the AngularJS Animate library and then you must refer to the . . . . . module in your application.

A) ng-repeat
B) ngAnimation
C) ngAnimate
D) None of above

2. Using the . . . . . . animation function, the parent animation can allow the child animation to run at the exact correct time.

A) animateChild
B) childAnimate
C) animateInner
D) innerChild

3. Options as well as input params can also be passed into an animation binding value when the animation kicks off.

A) True
B) False

4. Animations are fired using animation property bindings which are prefixed with an . . . . symbol.

A) &
B) #
C) $
D) @

5. . . . . . . allows for child elements to be collected and animated against a bunch of animation steps. We can now grab inner elements and make a really cool multi-element animation sequence.

A) child()
B) query()
C) stagger()
D) animate()

6. [Choose all which are correct]
The major addition to the animation DSL in Angular 4.2 is the ability to configure/override options for each of the step-based animation methods. These methods are:

A) sequence([...], { /* options */ })
B) groups([...], { /* options */ })
C) trigger([...], { /* options */ })
D) transition([...], { /* options */ })

7. . . . . . . is an animation-specific function that is designed to be used inside of Angular's animation DSL language. It is used to kick off a reusable animation that is created using animation().

A) useAnimation
B) reuseAnimation
C) in-useAnimation
D) All of above

8. With ngAnimate module you can add CSS but not JavaScript-based animations to your projects.

A) True
B) False

9. It's always possible to make use of animation input parameters by setting even more data via the . . . . . property.

A) options.param
B) option.params
C) option.param
D) options.params

10. . . . . . reverts all the used styles in the animation back to their end state value.

A) styles("*")
B) style("+")
C) style("*")
D) style("#")

Answers

Also see: A good source of information on Angular Animation Features.

Angular 4 Pipes Multiple Choice Questions with Answers

Angular 4 Pipes Multiple Choice Questions with Answers

Pipes transform displayed values within a template. A pipe takes in data as input and transforms it to a desired output. [via]

Practice your Angular 4 Pipes skills by answering below Angular 4 Pipes multiple choice questions with answers.

1) Just like filters in AngularJS, pipes are intended to encapsulate all the data transformation logic.

A) True
B) False

2) Using SlicePipe, answer below question:

var = "abcdefghijk";
{{var | slice:3:-3}}
A) defghi
B) defgh
C) kjih
D) abc

3) The Angular pipes differ in functionality from simple case changing to date and internationalisation, but most importantly, you can't write your own pipes.

A) True
B) False

4) The number pipe is location sensitive, which means that the same format argument will produce differently formatted results based on the . . . . . . .

A) user's format setting
B) user's currency setting
C) user's locale setting
D) all of above

5) One common thing between all the pipes is that all return exactly the same result each time we apply them to the same value and pass them the same set of arguments. Such pipes that hold the referentially transparency property are called . . . . pipes.

A) pure
B) impure
C) reference
D) none of above

6) Which of the following is not built-in pipe in Angular

A) DatePipe
B) CurrencyPipe
C) DataPipe
D) PercentPipe

7) The . . . . . decorator allows us to define the pipe name that is globally available for use in any template in the across application.

A) @pipeName
B) @pipeDeco
C) $Pipe
D) @Pipe

8) The . . . . . . . filter waits for a promise and returns the most recent value received. It then updates the view.

A) sync
B) async
C) promise
D) custom

9) The pure decorator property is used to tell Angular when to call the pipe’s transform method. The default value for the pure property is . . . . . .

A) False
B) True

10) If you chain multiple pipes together, they are executed . . . . .

A) in parallel
B) LIFO order
C) in the order in which you specify them
D) none of above

Answers