Single Page Web Applications with AngularJS Week 4 Quiz

Course Name: Single Page Web Applications with AngularJS

Course Link: Single Page Web Applications with AngularJS

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 32

Question 1
True or False. In Component-based Architecture, a component has well-defined public API.
True
False

Answer: True

Question 2
The default label (property name) that refers to the component’s controller in the template is:
component
controller
$ctrl
this

Answer: $ctrl

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Question 3
True or false? You must always provide a controller for every component you create.
True
False

Answer: False

Question 4
What new method was introduced to the component lifecycle methods in Angular 1.5.8 that allows you to hook into each turn of the digest cycle?
$onDigest
$onChanges
doCheck
$doCheck

Answer: $doCheck

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 33

Question 1
In implementing the Publish-Subscribe design pattern, what does Angular use for the “channel” portion of the pattern?
Global object (window)
Shared Services
$scope
$timeout

Answer: $scope

Question 2
If your component is set up to listen for some event using the $rootScope, what must you ensure to do in such a setup? For example, what must be done (if ANYTHING!) when you see the following in your component:

$ctrl.$onInit = function () {
  $rootScope.$on('alert:turnOn', handler);
  
  function handler(event, data) {
    //...
  }
}

Aside from implementing the handler function, not much left to do. Angular takes care of the rest.
The handler function must call the $emit method with the event name of ‘alert:turnOff’.
Weeeeeee! Ok, clearly not the right answer, but so much fun! 😀
We must deregister the handler when this view is destroyed. We can do this by declaring a local to controller variable called ‘cancelHandler’ and changing this line 2 to this:
cancelHandler = $rootScope.$on(‘alert:turnOn’, handler);
Then, add another lifecycle method to the component like this:

Answer: We must deregister the handler when this view is destroyed. We can do this by declaring a local to controller variable called ‘cancelHandler’ and changing this line 2 to this:
cancelHandler = $rootScope.$on(‘alert:turnOn’, handler);
Then, add another lifecycle method to the component like this:

See also  Single Page Web Applications with AngularJS Week 2 Quiz

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Question 3
Is it ever OK to call $rootScope.$emit(…)?
No, never.
Yes, calling $emit on the $rootScope would make ONLY the $rootScope in the application have a chance at catching that event.

Answer: Yes, calling $emit on the $rootScope would make ONLY the $rootScope in the application have a chance at catching that event.

Quiz 34

Question 1
Given the following snippet of code, which controllers would be declared in the ‘myApp’ module?

angular.module('myApp', [])
.controller("MyController1", MyController1);
 
angular.module('myApp')
.controller("MyController2", MyController2);

 angular.module('myApp', [])
.controller("MyController3", MyController3);

MyController1
MyController2
MyController3
MyController1 and MyController3
MyController2 and MyController3
None. This code will cause an error.

Answer: MyController3

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Question 2
When importing several artifacts of a module using the <script> tags in the HTML, dependencies of some service must be declared FIRST and only then the service itself.
True
False

Answer: False

Question 3
When importing your Angular code using the <script> tags in HTML, the order in which you list them does not matter as long as you specify the angular libraries code first (like angular.min.js, etc.)
True
False

Answer: False

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 35

Question 1
In Single Page Application (SPA) model, the responsibility of routing falls onto
the server
the browser
Cisco

Answer: the browser

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Question 2
Given the following HTML code, referred to as snippet #1:

<section>
  <ui-view>
    
  </ui-view>
</section>

and Javascript code, referred to as snippet #2

angular.module('App')
.config(RoutesConfig);
 
RoutesConfig.$inject = ['$stateProvider', '$urlRouterProvider'];
function RoutesConfig($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('viewA', {
      url: '/viewA',
      templateUrl: 'viewA.html'
    })
    
    .state('viewB', {
      url: '/viewB',
      templateUrl: 'viewB.html'
    });
    
  $urlRouterProvider
    .otherwise('/viewB');
}

What would appear on on line 3 of snippet #1 if the user were to attempt to go to a URL in the form of http://someHost/#/Weeeeeeeeee?
viewA.html
viewB.html
Contents of viewA.html
Contents of viewB.html
Browser would display a 404 error because there is no such URL configured.
Seriously, this is a professional course, can you stop with the whole ‘Weeee’ thing? (Yaakov’s response: “I refuse!”)

See also  Single Page Web Applications with AngularJS Week 5 Quiz

Answer: Contents of viewB.html

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 36

Question 1
Given the following snippet of Javascript code:

...
.state('home', {
  url: '/',
  templateUrl: 'home.html',
  controller: 'HomeCtrl as home'
});

and the following as part of the home.html file:

<div>
  {{ HomeCtrl.getExcitement(); }}
</div>

What would the user see? Assume there is method called getExcitement() defined on the implementation of the controller declared on the state. The method returns… you guessed it: “Weeeee”.
Weeeee
Nothing. It will display an error on the console.
Nothing. Absolutely nothing anywhere: not on the web page, not on the console.

Answer: Nothing. Absolutely nothing anywhere: not on the web page, not on the console.

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 37

Question 1
Given the following snippet of Javascript code:

...
.state('home', {
  url: '/',
  templateUrl: 'home.html',
  controller: 'HomeCtrl as home',
  resolve: {
    data1: 'Weeeee',
    data2: ['Service', function (Service) {
      return Service.methodReturnsPromise();
    }]
  }
});

and the following implementation of HomeCtrl:

HomeCtrl.$inject = ['data2'];
function HomeCtrl(data2) {
  ...
}

Which of the following statements are true?
An error will occur because HomeCtrl forgot to inject ‘data1’.
‘home’ view state will not be transitioned to until the promise returned by ‘methodReturnsPromise()’ is resolved.
‘home’ view state will not EVER show if the promise returned by ‘methodReturnsPromise()’ is rejected or an error occurs during ‘data2’ resolution.

Answer:
‘home’ view state will not be transitioned to until the promise returned by ‘methodReturnsPromise()’ is resolved.
‘home’ view state will not EVER show if the promise returned by ‘methodReturnsPromise()’ is rejected or an error occurs during ‘data2’ resolution.

See also  Single Page Web Applications with AngularJS Week 3 Quiz

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 38

Question 1
Given the following snippet of Javascript code:

...
.state('home', {
  url: '/{param1}',
  templateUrl: 'home.html',
  controller: 'HomeCtrl as home',
  resolve: {
    data1: 'Weeeee',
    data2: ['Service', function (Service) {
      return Service.methodReturnsPromise(???);
    }]
  }
});

We need to pass the value of param1 into the ‘methodReturnsPromise’. What do we need to do to get that done?

Answer: Replace line 8 and 9 with:

data2: ['$stateParams', 'Service', function ($stateParams, Service) {
      return Service.methodReturnsPromise($stateParams.param1);

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Quiz 39

Question 1
Given the following snippet of Javascript code:

...
.state('items.detail', {
  url: '/detail/{param1}',
  templateUrl: 'detail.html',
  ...
  }
});

Assuming the ‘items’ view state has a templateUrl with the value of ‘items.html’, what tag should be somewhere inside of the ‘items.html’ for this child state setup to make sense.

Answer:

<ui-view></ui-view>

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

Question 2
‘resolve’ properties declared on the parent view state can be injected into a controller declared for the child state without having to declare ‘resolve’ property on the child state definition.
True
False

Answer: True

Quiz 40

Question 1
True or False? All ui-router events are fired on the $scope
True
False

Answer: False

Question 2
In order to respond to errors that occur during the transition from one view state to another (including errors from resolves), you have to..
Wrap transitions in an try/catch block.
Nothing to do, ui-router automatically handles errors.
Set up a listener for $stateChangeError event and handle the error inside of that listener.

Answer: Set up a listener for $stateChangeError event and handle the error inside of that listener.

These are Single Page Web Applications with AngularJS Week 4 Quiz Answers

More Weeks of the course: Click Here

More Coursera courses: https://progiez.com/coursera

Single Page Web Applications with AngularJS Week 4 Quiz