Ir al contenido principal

AngularJS (Setup / Controller )

Download

  • angular.min.js

           https://angularjs.org/

  • Twitter Bootstrap (bootstrap.min.js)
          http://getbootstrap.com/


Module

  1. Is where we write our code

Implement Angular


  1. Create a javascript file to type your code
    • <script type="text/javascript" src="resources/myapp.js">
  2. Create a Module
    • In your javascript file create your first module
  3. Specify that is an Angular application
    • Add in the tag <html>  the attribute ng-app="module_name"
    • This means that will run the module with name  module_name

Tutorials

https://egghead.io/
http://www.thinkster.io/

API


http://kapeli.com/dash

Expressions

You can include in your code an expression 
  • {{  4 + 6 }}
  • {{ "Hello" + "message" }}

Controller

Where is defined the app's behaviour, the functions and values

Create a Controller


  1. Create a function
    • (function () {}  ) ();
    • As a good practice wrap your function in a closure
  2. Create a Module
    • var app = angular.module('controller', []);
  3. Define the controller inside the function
    • app.controller('AppController', function (){
    • });
  4. Define the properties inside the controller function
    • this.saleproduct= object4Sale;
    • Where object can be
      • var object4Sale= {
      •   name: 'Porche' , 
      •   price: 295 , 
      •   desc: "My first car"
      • }
Ending in something like this

var app = angular.module('store', []);

(function() {

var app = angular.module('controller', []);

app.controller('AppController', function() {

this.saleproduct = object4Sale;
});

var object4Sale = {
name : 'Name',
price : 2.95,
desc: "My first product sold"
}

})();

Display our controller in the View

  1. Add the Directive ng-controller to add the controller 
    •  <div ng-controller="AppController as store">
      • AppController is you controller name
      • store is an allias
    • Inside the div display the information calling the properties
      • {{ product.saleproduct.name}}






Comentarios

Publicar un comentario

Entradas populares de este blog

Python create package

Create a root folder Create a sub-folder "example_pkg" that contains the funtionallity packaging_tutorial/ example_pkg/ __init__.py In the root folder create the following structure  packaging_tutorial/ example_pkg/ __init__.py tests/ setup.py LICENSE README.md in the setup.py contains the configuration of the packages your package is found by find_packages() import setuptools with open ( "README.md" , "r" ) as fh : long_description = fh . read () setuptools . setup ( name = "example-pkg-YOUR-USERNAME-HERE" , # Replace with your own username version = "0.0.1" , author = "Example Author" , author_email = "author@example.com" , description = "A small example package" , long_description = long_description , long_description_content_type = "text/markdown" , url = "https://github.com/pypa/sam...
Publicar un comentario
Leer más

Rails - Basic Steps III

pValidations Validations are a type of ActiveRecord Validations are defined in our models Implement Validations Go to   root_app/app/models Open files  *.rb for each model Mandatory field validates_presence_of   :field Ex:   validates_presence_of    :title Classes The basic syntax is class MyClass        @global_variable                def my_method              @method_variable        end end Create an instance myInstance = MyClass.new Invoke a mehod mc.my_method class() method returns the type of the object In Ruby, last character of method define the behavior If ends with a question -> return a boolean value If ends with an exclamation -> change the state of the object Getter / Setter method def global_variable       return @global_variable end ...
Publicar un comentario
Leer más

Android - Basic Steps (Service)

Service Run in the main thread of the hosting application Android can kill the Service if need the resources Purpose Supporting inter-application method execution Performing background processing Start a Service Call Context.startService(Intent intent)\ To call from a Fragment use getActivity().getApplicationContext().startService( intentService); Executing the service After call startService(...)  In the Service is executed the method onStartCommand(...) If the method returns the constant START_NOT_STICKY then Android will not restart the service automatically if the the process is killedp Foreground To execute the service foreground call the method startForeground() Use this if the user is aware of the process Bind to a Service Call the method Context.bindService( Intent service ServiceConnection con int flags ) Send Toast from the Service On the method onStartCommand receive the message   ...
Publicar un comentario
Leer más