AI, Deep Learning, Technology, and Programming

Introduction to AngularJS Controller As Syntax In the previous installment of this series we discussed scopes and what problems nested scopes can cause. There are a couple of solutions to this problem: the so-called Controller As syntax introduced by AngularJS 1.2 and .component() method introduced by AngularJS 1.5. The latter option is a recommended way to go if you are thinking about upgrading your application to newer Angular versions. In this post we’ll talk about AngularJS Controller As syntax. As was mentioned previously, when we instruct Angular to use a controller with the ng-controller directive, a new instance of a controller and a child scope is created. Alternatively, the same directive but with a different syntax can be used to create a controller and to attached it to a newly-created scope as the snippet below shows. The differences are that, first, in the ng-controller directive we not only pass the name of the registered controller, but also, a variabl...

Introduction to AngularJS Scopes In the previous tutorial of this series we learned how to test controllers using Jasmine and Karma. In this post we discussed how data is passed from controller to view using $scope , which is the glue that links model and view. In this tutorial we’ll talk more about scopes, what are some possible pitfalls in using them, and later we’ll talk about the ways to overcome possible problems, as well as get over Batarang, a Chrome extension from AngularJS team, which can be used to analyze scopes inside an AngularJS application. By adding the ng-app directive to some HTML tag we specify that an AngularJS will be created and in the process of application creation Angular creates the so-called root scope . Some other directives such as ng-controller create a child scope. To visualize scopes one can use a Google Chrome extension called Batarang . The picture below shows the root scope for the AngularJS application and the child scope created by Hell...

In the previous installment of this series we’ve learned how to perform End-to-End application testing using Jasmine and Protractor. In this part, we’ll discuss how to test controllers and how to automate this process. In fact, running tests manually may make the whole process tedious and may prompt one not to use tests altogether, so we’ll learn how to make test run in background and restart when you save your code. Adding Karma to AngularJS project As a first step, we’ll add test automation to our project. To streamline testing of Angular applications, Google created a special test automation framework called Karma which in turn can rely on various testing frameworks such as Jasmine and run tests any time you save a file in your project. To add Karma and other tools necessary for testing to the project it is necessary to execute the following command. npm install karma karma-jasmine karma-chrome-launcher jasmine-core angular-mocks --save-dev We added several de...