Single Page Web Applications with AngularJS Week 3 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 3 Quiz Answers

Quiz 22

Question 1
To manually create an asynchronous environment, you must call the following method in the $q service:
deferred.promise()
$q.defer()
deferred.resolve()

Answer: $q.defer()

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

Quiz 23

Question 1
Given the following snippet of code, what appears to be missing from this asyncFunction (if anything)?

function asyncFunction (someVal) {
  var deferred = $q.defer();
  
  if (someVal > 3) {
    deferred.resolve({val: (someVal + 3)});
  }
  else {
    deferred.reject("Everything is wrong! Wrong, I tell you!");
  }
}

Nothing is missing
the resolve() method must be called unconditionally, i.e., no matter what to get the promise to return.
Right after line 9, we need to call:
return deferred.promise;
Right after line 9, we need to call:
return deferred;

Answer: Right after line 9, we need to call:
return deferred.promise;

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

Question 2
What method would one use in order to deal with multiple asynchronous functionality all at once?
Use the then() method
Use the $q.all() method.
Use the catch() method.
Use the finally() method.

Answer: Use the $q.all() method.

Question 3
True or false? Calling the reject() method cancels the promise.
True
False

Answer: False

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

Quiz 24

Question 1
The only required property of the $http service configuration object is:
method
params
url
header

Answer: url

Question 2
What is the difference between snippet 1:

$http({
  method: "GET",
  url: ("http://some-url?" + "fullName=" + someVal)
});

and snippet 2:

var params = {fullName: someVal};
$http({
  method: "GET",
  url: "http://some-url",
  params:params
});

There is no difference
First snippet executes faster
In the first snippet, request parameters will not be URL encoded and that may cause issues for resource retrieval.

Answer: In the first snippet, request parameters will not be URL encoded and that may cause issues for resource retrieval.

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

Quiz 25

Question 1
In the following code snippet, what would be the output seen in the console?

$http({
  method: 'GET',
  url: 'http://someurl.com'
})
.then(function(response) {
  console.log(response)
});

The payload data sent from the server
The full HTTP response, broken out into separate objects to represent response headers, payload data, etc.
The then() method requires BOTH a success and an error functions, so this will be an error.

See also  Single Page Web Applications with AngularJS Week 1 Quiz

Answer: The full HTTP response, broken out into separate objects to represent response headers, payload data, etc.

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

Question 2
In the following code snippet, what property of the ‘response’ object needs to be referenced in order for the payload of the response to be output to the console?

$http({
  method: 'GET',
  url: 'http://someurl.com'
})
.then(function(response) {
  console.log(response.???)
});

payload
data
http
header.data

Answer: data

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

Quiz 26

Question 1
The process of Angular translating custom tags or custom elements (i.e., directives) into other HTML tags and possibly behavior is called…
Interpolation
Translation
Compilation
Polyfill

Answer: Compilation

Question 2
Given the following directive declaration:

.directive('thisCourseIsAwesome', weee);

What are the possible valid ways of using this directive in an HTML template (among the ones presented)?

Answer:

  1. <this-Course-Is-Awesome>weeeeeee!</this-Course-Is-Awesome>
  2. <this-course-is-awesome>weeeeeeee!</this-course-is-awesome>
  3. <div this-course-is-awesome=”Yes, it is, but this weeee thing is starting to get on my nerves. Stop it!”>
      Ok. sure thing… Weeeeeeeee!
    </div>

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

Quiz 27

Question 1
If the DDO does not define the ‘scope’ property, the scope used inside of the directive will be…
The same scope object that belongs to the global controller
The same scope object that belongs to the parent controller of this directive because that scope is passed into the directive automatically.
The same scope object that belongs to the parent controller of this directive because of prototypal inheritance.
A new scope because Angular creates one by default.

Answer: The same scope object that belongs to the parent controller of this directive because of prototypal inheritance.

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

Question 2
Given the following code snippet:

...
.directive("myDirective", weeeFunction);
 
function weeeFunction() {
  var ddo = {
    scope: {
      obj1: '=property2',
      obj2: "=?"
    }
  };
    
return ddo;
}

What could the HTML template that uses this directive look like?

Answer:

<my-directive property2=”ctrl.someObj”></my-directive>
<my-directive property2=”ctrl.someOtherObj” obj2=”ctrl.someObj”></my-directive>

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

Question 3
Given the following code snippet:

...
.directive("myDirective", weeeFunction);
 
function weeeFunction() {
  var ddo = {
    scope: {
      property1: '@myProp'
    }
  };
    return ddo;
}

Choose 1 or more correct uses of this directive.

<my-directive my-prop=”{{ctrl.someProp}}”></my-directive>
<my-directive my-prop=”Hey There!”></my-directive>

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

Quiz 28

Question 1
Given the following snippet, what property or properties appear to be missing in order to accomplish the ‘controller as’ syntax with bound properties?

...
.directive("myDirective", weeeFunction);
 
function weeeFunction() {
  var ddo = {
    scope: {
      prop: '='
    },
    controllerAs: 'myCtrl',
    templateUrl: 'somePage.html'
  };
   
 return ddo;
}

bindToController
controller
bindToController and controller

See also  Single Page Web Applications with AngularJS Week 4 Quiz

Answer: bindToController and controller

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

Question 2
True or False? The variable name in line 19 must match whatever value is declared in the ‘controllerAs’ property.

...
.directive("myDirective", weeeFunction);
 
function weeeFunction() {
  var ddo = {
    scope: {
      prop: '='
    },
    templateUrl: 'somePage.html',
    bindToController: true,
    controller: MyController,
    controllerAs: 'myCtrl'
  };
   
  return ddo;
}
 
function MyController() {
  var myCtrl = this;
  ...
}

True
False

Answer: False

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

Question 3
True or False. It’s the directive’s controller that should be in charge of changing the data that’s passed into its isolate scope.
True
False

Answer: False

Question 4
True or False. Using the one-way binding with ‘<‘ guarantees that if the directive changes the passed in data, nothing outside of the directive will be affected.
True
False

Answer: False

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

Quiz 29

Question 1
Given the following snippet of directive’s template code and assuming that myMethod is the property name on the isolate scope that’s declared with ‘&’ as the value:

<button ng-click="dirController.myMethod(dirController.arg);"

What must the ‘dirController.arg’ value be?
Anything that makes sense for the business logic of the parent controller: string with a name, object with name property, etc.
A map of key/value pairs, where the key is the argument name with which the parent controller declared this method call in the parent’s template.

Answer: A map of key/value pairs, where the key is the argument name with which the parent controller declared this method call in the parent’s template.

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

Question 2
In Javascript, functions are just objects. So, why can’t you just pass in a function to execute into the directive using ‘=’ just like any other object?
Passing function values using ‘=’ is not possible in Angular.
You could do that, but it’s generally not a good idea to do that because that function can refer to the ‘this’ variable (or might at some future version of it), and the ‘this’ reference will therefore not refer to what it was originally intended to. It will refer to the directive’s controller instance instead of the parent controller’s instance.
Passing it as a ‘&’ or reference is just new syntax. It’s the same thing as passing it through ‘=’ syntax.

See also  Single Page Web Applications with AngularJS Week 5 Quiz

Answer: You could do that, but it’s generally not a good idea to do that because that function can refer to the ‘this’ variable (or might at some future version of it), and the ‘this’ reference will therefore not refer to what it was originally intended to. It will refer to the directive’s controller instance instead of the parent controller’s instance.

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

Quiz 30

Question 1
To inject ‘MyService’ into the link function, you must do something similar to this:

MyLinkFunction.$inject = ['MyService'];
function MyLinkFunction (MyService) {
  //...
}

True or False?
True
False

Answer: False

Question 2
The link function’s ‘element’ argument refers to what?
The root element of the HTML document
The element configured through the DDO.
The top level element in the directive’s template.
Top level element of the directive

Answer: Top level element of the directive

Question 3
What needs to be done in order to have the ‘element’ argument refer to a jQuery (not jqLite) object?
Inject jQuery service into the directive
Do a DOM lookup for the jQuery object.
Include jQuery JS library in the HTML before the AngularJS library is included.
Angular already uses jQuery by default, so nothing needs to be done.

Answer: Include jQuery JS library in the HTML before the AngularJS library is included.

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

Quiz 31

Question 1
If myDirective has ‘transclude: true’ and a template that looks like this:

<span ng-transclude></span>

Assuming the myDirective directive has its own someProp property set to the string “Weee!” and the MyController.someProp is equal to the string “Again with this weee thing!”, what will be output in line 4?

<div ng-contoller="MyController as myCtrl">
   
 <my-directive>
    {{myCtrl.someProp}}
  </my-directive>
  
</div>

Weee!
Again with this weee thing!

Answer: Again with this weee thing!

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

More Weeks of the course: Click Here

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

Single Page Web Applications with AngularJS Week 3 Quiz