AngularJS (programming language) - HKT SOFT

Getting Ready AngularJS

1. What Do You Need to Know? Before reading this book, you should be familiar with the basics of web development, have an understanding of how HTML and CSS work, and, ideally, have a working knowledge of JavaScript. If you are a little hazy on some of these details, I provide refreshers for the HTML, [ [ ...]

Getting Ready AngularJS: How Do You Set Up Your Development Environment?

You can get started with AngularJS development with a browser, a text editor, and a web server. One of the nice aspects of working on client-side web app development is that you can pick and mix from a wide range of development tools to create an environment that suits your working style and coding practice. [ [ ...]

Your First AngularJS App: Preparing the Project

In Chapter 1, I showed you how to create and test the development environment that I use in this book. If you want to follow the examples, now is the time to get everything up and running. I am going to start with a static HTML mock-up of my goal in this chapter, which is [ [ ...]

Your First AngularJS App: Applying AngularJS to the HTML File

It is easy to add AngularJS to an HTML file. Simply add a script element to import the angular.js file, create an AngularJS module, and apply an attribute to the html element, as shown in Listing 2-2. Listing2-2. Creating and Applying an AngularJS Module in the todo.html File <!DOCTYPE html> <html ng-app=”todoflpp”> <head> <title>TO DO [ [ ...]

Your First AngularJS App: Creating a Data Model

AngularJS supports the Model-View-Controller (MVC) pattern, which I describe in Chapter 3. In short, following the MVC pattern requires you to break up the application into three distinct areas: the data in the application (the model), the logic that operates on that data (the controllers), and the logic that displays the data (the views). The [ [ ...]

Your First AngularJS App: Creating a Controller

The controller defines the business logic required to support a view, although the term business logic isn’t helpful. The best way of describing a controller is to explain what kinds of logic it doesn’t contain—and what’s left goes into the controller. Logic that deals with storing or retrieving data is part of the model. Logic [ [ ...]

Your First AngularJS App: Creating a View

Views are generated by combining data the controller provides with annotated HTML elements that produce content for the browser to display. In Listing 2-5, you can see how I have used one kind of annotation, known as a data binding, to populate the HTML document with the model data. Listing2-5. Displaying the Model Data with [ [ ...]

Your First AngularJS App: Using Two-Way Model Binding

The bindings I used in the previous section are known as one-way bindings, where values are taken from the model and used to populate the elements in a template. This is pretty standard stuff and is a widely used technique in web app development. For example, I often use the Handlebars template package when I [ [ ...]

Your First AngularJS App: Creating and Using Controller Behaviors

Controllers define behaviors on the scope. Behaviors are functions that operate on the data in the model to implement the business logic in the application. The behaviors defined by a controller support a view to display data to the user and to update the model based on user interactions. To demonstrate a simple behavior, I [ [ ...]

Your First AngularJS App: Using Behaviors That Depend on Other Behaviors

One of the themes that runs through AngularJS is just how naturally the underlying characteristics of HTML, CSS, and JavaScript have been coopted for web application development. As an example, since behaviors are created using JavaScript functions, you can create behaviors that are built on the capabilities provided by other behaviors in the same controller. [ [ ...]

Your First AngularJS App: Responding to User Interaction

You have seen how behaviors and directives can be combined to create app features, and it is this combination that drives much of the functionality in an AngularJS app. One of the most powerful combinations is achieved when using directives and behaviors to respond to user interaction. In Listing 2-9, you can see the additions [ [ ...]

Your First AngularJS App: Filtering and Ordering Model Data

In Chapter 14, I describe the AngularJS filter feature, which provides a nice way of preparing data in the model for display in views without having to create behaviors. There is nothing wrong with using behaviors, but filters tend to be more general-purpose and lend themselves to reuse across an application. Listing 2-10 shows the [ [ ...]

Your First AngularJS App: Getting the Data via Ajax

The last change I am going to make is to obtain the to-do list data as JSON data via an Ajax request. (I describe JSON in Chapter 5 if you are unfamiliar with it.) I created a file called todo.json in the angularjs folder; you can see the contents in Listing 2-13. Listing2-13. The Contents [ [ ...]

Putting AngularJS in Context: Understanding Where AngularJS Excels

AngularJS isn’t the solution to every problem, and it important to know when you should use AngularJS and when you should seek an alternative. AngularJS delivers the kind of functionality that used to be available only to server-side developers, but entirely in the browser. This means that AngularJS has a lot of work to do [ [ ...]

Putting AngularJS in Context: Understanding the MVC Pattern

The term Model-View-Controller has been in use since the late 1970s and arose from the Smalltalk project at Xerox PARC where it was conceived as a way to organize some early GUI applications. Some of the fine detail of the original MVC pattern was tied to Smalltalk-specific concepts, such as screens and tools, but the [ [ ...]

Putting AngularJS in Context: Understanding RESTful Services

As I explained in the previous chapter, the logic for domain models in AngularJS apps is often split between the client and the server. The server contains the persistent store, typically a database, and contains the logic for managing it. In the case of a SQL database, for example, the required logic would include opening [ [ ...]

Putting AngularJS in Context: Common Design Pitfalls

In this section, I describe the three most common design pitfalls that I encounter in AngularJS projects. These are not coding errors but rather problems with the overall shape of the web app that prevent the project team from getting the benefits that AngularJS and the MVC pattern can provide. 1. Putting the Logic in [ [ ...]

Understanding HTML

The best place to start is to look at an HTML document. From this, you can see the basic structure and hierarchy that all HTML documents follow. Listing 4-1 shows the simple HTML document that I used in Chapter 2. This isn’t the first listing that I showed you in that chapter but comes a [ [ ...]

Understanding Bootstrap

HTML elements tell the browser what kind of content they represent, but they don’t provide any information about how that content should be displayed. The information about how to display elements is provided using Cascading Style Sheets (CSS). CSS consists of a comprehensive set of properties that can be used to configure every aspect of [ [ ...]

JavaScript Primer: Preparing the Example Project

For this chapter, I will be demonstrating some basic JavaScript techniques and some helpful general-purpose utility methods that AngularJS provides to supplement the JavaScript language. Ensure that the angular.js, bootstrap.css, and bootstrap-theme.css files are in the web server angularjs folder, and create a new HTML file called jsdemo.html. Set the contents of the HTML file [ [ ...]

1
2
3
4
…
6