Level 7 Level 9
Level 8

AngularJS Directives II

72 words 0 ignored

Ready to learn       Ready to review

Ignore words

Check the boxes below to ignore/unignore words, then click save at the bottom. Ignored words will never appear in any learning session.

All None

Load the content of a <script> element into $templateCache, so that the template can be used by ngInclude, ngView, or directives.
HTML <select> element with angular data-binding.
What are Directives
extend HTML with custom attributes and elements
What's a Model
the data that is shown to the user and with which the user interacts
What is the Compiler
parses the template and instantiates directives and expressions
What's a Filter
formats the value of an expression for display to the user
What's a View
what the user sees (the DOM)
What's Data Binding
sync data between the model and the view
What is Dependency Injection
Creates and wires objects / functions for html (view) to invoke
Whats a Service
reusable business logic independent of views
What are Expressions
access variables and functions from the scope
What is Angular
AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly.
When should you use an attribute versus an element?
Use an element when you are creating a component that is in control of the template. The common case for this is when you are creating a Domain–Specific Language for parts of your template.…
{1} – object {2} – objects property ng–model="data.message" ng–model="person.name" ng–model="person.age" ng–model="car.name" ng–model="car.age"
What are the values of {1} and {2} ng–model={1}.{2}
E = Element A = Attribute <!–– Element ––> <foo> .... </foo> <!–– attribute ––> <div foo> ... </div>
When creating a directive, you can restrict it, so for example app.directive("foo", function() { return: { restrict: 'EA' ... } }) This directive is restricte…
What are scopes
scope is an object that refers to the application model. It is an execution context for expressions. Scopes are arranged in hierarchical structure which mimic the DOM structure of the application. Scopes can watch expressions and propagate events.
What is the difference between a child scope and and isolate scope
A child scope (prototypically) inherits properties from its parent scope. An Isolate scope does not.
Use it in
* What's the difference between ng–if and ng–show?
ng–if removes or adds dom elements. ng–show hides or reveals dom elements. ng–show uses CSS
ng–submit = forms, ng–click = a button or div.
* Why would you use ng–submit instead of ng–click in some cases?
Why use brackets in DI?
Allows code to be minified
Don't really attach things to $rootScope unless it is a pretty global feature like logging.
$rootScope (what can you attach and why would you attach things to this?)(When should you attach things to it?)
{{$index}} gives you the index at the iteration of the loop you are in inside of ng–repeat
$log ($rootScope.$log) $log.debug $log.info $log.warn
This is the type of event being fired ng–click="foo($event)"
Disables $log.debug
How to filter?
filter: expression (this can be a variable – bound to ng–model – or an object to allow you to filter a list of objects. {name: 'M', number: 1} See docs
ng–bind vs ng–model
ng–bind – one way data binding ng–model is intended for forms and uses two way data binding
Makes it so you won't see flicker.
type friendly injections
Factories and Providers are NOT type friendly because their definition tends to be more dynamic in nature. The other types of services are more fixed and secure at runtime.
When to use Provider?
If you need a globally configurable service or one that is available in the config phase.
The first time a template is loaded it is stored in the templateCache. You can manually enter templates into the cache using $templateCache inside app.run or by putting a script tag somewhere wher…
Where to make network calls? Alert error from network call – where to put it?
Error handling for http requests should be in your service. All of the heavy logic for your application should be in your services. Especially anything that has to do with data and data retrieval.
ng–style and ng–class?
The ngStyle directive allows you to set CSS style on an HTML element conditionally. ngClass directive allows you to dynamically add and remove classes.
$http interceptors
Handles pre–processing of server requests. Interceptors are service factories registered on $httpProvider
ng–messages & ng–message
(form validation) (no complex ng–if sequence) Used when displaying errors on a form
When and where use $watch?
Use it rarely. Whenever you want a variable watched. $scope.$watch('myVar', function(){......
stateful vs stateless filter
Filters should be stateless. aka they shouldn't have external dependencies. Everything needed should be passed in as an argument.
scope and $scope?
scope is directive property and $scope is angular?
$broadcast vs $emit
One sends message up chain the other down.
* What are $timeout and $interval and how do you cancel them?
$timeout is setTimeout but with an automatic $scope.$apply wrapper around the callback function.
React, Polymer
* What's dirty checking? (Does anyone else use it?)
$digest and $apply?
$apply manually triggers the digest cycle. Pass a function in as an argument and after that function evaluates the digest cycle will be called. A call will be made to $rootScope.$digest Always use $apply(…
* How would you inject server rendered data into angular?
What's new in 1.3
wy angular js ?
directive ?
it links the html code to javascript and tells html when to run or refer to JS code
what are modules?
explain each of the components of the following code ––
using ng–app, which is a directive
how will you include a module into the html code?
{{ ...... }}
what are controllers?
for example we have an object called gem and we need to sell it on out webpage ( html code) So controllers bridge this gap by connecting data with html
how to add controllers into the html code
how will you implement the price, description and reviews of a product of the module 'store' using expressions
how restricted is the scope of a controller ?
explain the relevance of ng–show directive below ––
use of "ng–hide=store.product.soldOut" ?
if the product is sold out from the store, then ng–hide will hide the corresponding html element
used mainly for looping through an array
what does ng–repeat do or is used for ?
No, only one app is automatically initialized. Others have to manually initialized.
With more than one ng–app in an HTML document (an HTML page), are all of them automatically initialized?
using angular.bootstrap––––
how to manually start up the angular application?
Can multiple angular applications be bootstrapped using same element
no Only one AngularJS application can be auto–bootstrapped per HTML document. The first ngApp found in the document will be used to define the root element to auto–bootstrap as an application. To run multiple applicat…
At framework level, how does Angular retrieve the matching elements for processing
1)Makes use of jqLite(element) function. 2)If jQuery is used, jQuery(element) is used by way of assigning jQuery to jqLite variable
Which angular function is used to wrap a raw DOM element or HTML string as a jQuery element?