- Fork this repo
- Clone your fork
- Fill in your answers by writing the appropriate area, or placing an 'x' in the square brackets for multiple-choice questions
- Add/Commit/Push your changes to Github
- Open a pull request
Instantiate a new Angular module called blog that takes ui.router as a dependency.
angular
.module("blog", [
"ui.router"
])One button below has an ng-click attribute; the other has data-ng-click instead. What difference does it make?
<button ng-click="vm.create()">Click</button>
<button data-ng-click="vm.create()">Click</button>They are the same thing. Data-ng-click is just used to make a valid HTML.
Which of the three following options demonstrates the best usage of ng-app? Explain your answer.
Option A demonstrates the best usage. Ng-app is used as a directive to define an AngularJS application. Since the title states 'My app', I'm assuming that the entire HTML document is the 'owner' of the AngularJS application called "myapp".
<!DOCTYPE html>
<html data-ng-app="myapp">
<head>
<title>My app</title>
</head>
<body>
<h1><a data-ui-sref="index">My App</a></h1>
<div></div>
</body>
</html><!DOCTYPE html>
<html>
<head data-ng-app="myapp">
<title>My app</title>
</head>
<body>
<h1><a data-ui-sref="index">My App</a></h1>
<div></div>
</body>
</html><!DOCTYPE html>
<html>
<head>
<title>My app</title>
</head>
<body>
<h1><a data-ui-sref="index">My App</a></h1>
<div data-ng-app="myapp"></div>
</body>
</html>Imagine an app in which a change to the view updates the model without a page refresh, and a change to the model updates the view without a page refresh.
Which one of the following concepts does this best illustrate?
[ ] A: Modularity
[ ] B: MVC
[X] C: Two-way data-binding
[ ] D: Separation of concerns
What is the ui-sref directive, and how is it used?
Ui-sref is a directive that binds a link (<a> tag) to a state. It can also be used to take in params as such: ui-sref='stateName({param: value, param: value})'. An example of ui-sref incorporated into a navbar:
<a ui-sref="home">Home</a> | <a ui-sref="contact">Contact</a>
Below is an index controller action that maps to a Post model in a Rails application. How would you modify it so that it can respond with a list of posts in either HTML or JSON form, depending on the incoming HTTP request?
class PostsController < ApplicationController
def index
@posts = Post.all
endclass PostsController < ApplicationController
def index
@posts = Post.all
respond_to do |format|
format.html { render :index}
format.json { render :json}
end
endLet's say the Posts in the previous question are available when you visit http://localhost:3000. In a front-end application, how could you do the following using jQuery...
- Retrieve all the posts in JSON form
- If Step 1 is successful, print the resulting JSON to the console
- If Step 1 is unsuccessful, print an error message to the console
$(document).ready(() => {
$(".get").on("click", () => {
$.ajax({
type: 'GET',
dataType: 'json',
url: "/home"
}).done((response) => {
console.log(response);
}).fail((response) => {
console.log("Ajax failed: ", response);
})
})
})Using the same front-end application and Rails API from the previous question, how would you use jQuery to create a Post through the API? You can assume the following...
- The API is RESTful
- The
PostsControllercontains a strong params method that is used when creating an instance of thePostmodel - Each Post has
titleandbodyattributes, both of which are strings
If the Post creation is successful, the new Post should be printed to the browser console. Otherwise, an error message should be printed to the console.
$(document).ready(() => {
$(".post").on("click", () => {
$.ajax({
type: 'POST',
dataType: 'json',
url
}).done((response) => {
console.log(response);
}).fail((response) => {
console.log("Ajax failed: ", response);
})
})
})
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent