RcBuilder@walla.com
call centre: 054-5614020

angular tracks basic example

Posted by: RcBuilder  /   Category: $http / AngularJS / autocomplete / Controllers / CSS / Data Providers / Directives / Events / Factories / HTML / JAVASCRIPT / jQuery / jquery-ui / Model / module / OOP / Services / Views   /   No Comments
27
Jan
2016

angular tracks basic example app.js var module = angular.module('my-app', ; $scope.tracks = ); } $scope.Search = function () { tracksFactory.searchForTracks($scope.searchPhrase, function (response) { $scope.tracks = response; }); } $scope.LoadAutocomplete = function () { if ($scope.searchPhrase.lengh < 3) return; tracksFactory.getNames($scope.searchPhrase, function (response) { angular.element("#searchPhrase").autocomplete({ source: response }); }); } }); module.factory('tracksFactory', function ($http) { var server = 'http://ws.audioscrobbler.com/2.0/'; var queryBase = '?method=track.search&track={0}&api_key=0604d2c5492dc743997cabe3fd636099&format=json&limit={1}'; var foreach = function (arr, callback) { for (var i = 0; i < arr.length; i++) callback.call(arr); }; return { getNames:.

Read more

angular modules

Posted by: RcBuilder  /   Category: AngularJS / Config / Model / module / Routing   /   No Comments
26
Jan
2016

angular modules you can refer to module as a container or a namespace it's recommended to bind a module to your page and turn it to some sort of an application you can add config to each module and then add a routes mechanism to it bind a page to specific module - to bind a page to a specific.

Read more

Angular module dependency

Posted by: RcBuilder  /   Category: $http / $location / AngularJS / Config / Controllers / Data Providers / Directives / Factories / Filters / Model / module / Routing / Services   /   No Comments
26
Jan
2016

Angular module dependency STEPS 1. create a module and add elements to it (directives, filters etc.) 2. add the js file where your module is defined to the application e.g: <script type="text/javascript" src="app/dependencies/some_module.js"></script> 3. add your module as a dependency to the current active module var my_module = angular.module('my_application', ); 4. that's it! use elements from your module in the current application Example -- some_module.js.

Read more

angular phone finder basic example

Posted by: RcBuilder  /   Category: AngularJS / Controllers / Data Bind / Data Providers / Directives / Events / Examples / Factories / Filters / Model / module / Services / Views   /   No Comments
26
Jan
2016

angular phone finder basic example <!doctype html> <html> <head> <title>Test 888</title> <style type="text/css"> select { width: 120px;} div.filters > div{ padding:4px 0; border-right:solid 1px #ddd; } div.header{ height:40px; line-height:40px; text-align:center; border-bottom:solid 2px #000; } span.required { font-size:12px; color:red; } </style> </head> <body> <div ng-app="myApp"> <div ng-controller="homeController"> <div class="row header"> Phone Finder </div> <div class="row"> <div class="col-md-2 filters"> <div> <select ng-model="selectedCountry"> <option value="" selected>select</option> <option ng-repeat="country in countries">{{country}}</option> </select> <span ng-show="!hasSelectedCountry" class="required"> required </span> </div> <div> <select ng-model="selectedCity"> <option value="" selected>select</option> <option ng-repeat="city in cities">{{city}}</option> </select> <span ng-show="!hasSelectedCity" class="required"> required </span> </div> <div> <input type="button" ng-click="Search()" value="Search" /> </div> </div> <div class="col-md-10"> <table class="table table-bordered table-striped"> <tr ng-repeat="user in users"> <td>{{user.id}}</td> <td>{{user.name}}</td> <td>{{user.phone}}</td> </tr> </table> </div> </div> </div> </div> <script type="text/javascript".

Read more

angular cards Game basic example

Posted by: RcBuilder  /   Category: AngularJS / Controllers / Directives / Events / Examples / Model / module / Views   /   No Comments
26
Nov
2014

angular cards Game basic example <!doctype html> <html lang="he" ng-app="my_application"> <head> <title></title> <script src="angular.min.js" type="text/javascript"></script> <style type="text/css"> .Card{ width:300px; height:300px; line-height:300px; background-color:#ddd; text-align:center; font-size:200px; } .Result { width:600px; text-align:center; padding-top:20px; font-size:100px; } </style> </head> <body> <div ng-controller="HomeController"> <div style="display:inline-block;"> <ng-Card number="{{numberLeft}}" ng-click="Choose('LEFT');" /> </div> <div style="display:inline-block;"> <ng-Card number="{{numberRight}}" ng-click="Choose('RIGHT');" /> </div> <div class="Result"> {{ Result }} </div> </div> </body> <script type="text/javascript"> var app = angular.module('my_application', []); app.directive('ngCard', function () { return { restrict: 'E', // tag or comment template: '<div class="Card">{{ number }}</div>', replace: true, scope: { number: "@number" } }; }); app.controller('HomeController', function ($scope) { $scope.numberLeft = $scope.numberRight = 0; $scope.Result = ''; $scope.Choose.

Read more

Angular basic Example

Posted by: RcBuilder  /   Category: $http / AngularJS / Config / Controllers / Data Bind / Data Providers / Directives / Events / Examples / Factories / Filters / Model / module / Routing / Services / Views   /   No Comments
27
Oct
2014

Angular basic Example index.htm <!doctype html> <html ng-app="my_application"> <head> <title>AngularJS</title> <style> body{ font: normal normal 400 12px/1.2em arial; background-color:#FFFFFE;} </style> </head> <body> <ul> <li> <a href="#users">Users</a> <ul> <li><a href="#users/Roby">Users1</a></li> <li><a href="#users/Shirly">Users2</a></li> </ul> </li> <li><a href="#products">Products</a></li> </ul> <!-- active view placeholder--> <div ng-view class="slide-animation"></div> <script type="text/javascript" src="angular.min.js"></script> <script type="text/javascript" src="angular-route.min.js"></script> <script type="text/javascript" src="angular-animate.min.js"></script> <script type="text/javascript" src="app/config.js"></script> <script type="text/javascript" src="app/factories/products.js"></script> <script type="text/javascript" src="app/factories/users.js"></script> <script type="text/javascript" src="app/controllers/products.js"></script> <script type="text/javascript" src="app/controllers/users.js"></script> <script type="text/javascript" src="app/directives/global.js"></script> <script type="text/javascript" src="app/directives/products.js"></script> <script type="text/javascript" src="app/filters/global.js"></script> <script type="text/javascript" src="app/filters/products.js"></script> <script type="text/javascript" src="app/app.js"></script> </body> </html> app.js // define the page as application (module is a.

Read more

AngularJS Events

Posted by: RcBuilder  /   Category: AngularJS / Controllers / Data Bind / Events / Model / module   /   No Comments
26
Oct
2014

AngularJS Events $watch * event that fired any change at the specified model * apply from the $scope structure $scope.$watch(, function); example // this event will replace any 'e' letter to 'E' <input type="text" ng-model="message_model" /> $scope.$watch('message_model', function(){ $scope.message = $scope.message.replace('e', 'E'); }); example // this event will show a message when the input value is too long <input type="text" ng-model="someModel" placeholder="enter text" style="width:100px;" /> <span ng-show="isTooLong" ng-class="'redTitle'">Too long!!!</span> $scope.isTooLong =.

Read more

AngularJS built-in directives

Posted by: RcBuilder  /   Category: AngularJS / Directives / HTML / HTML 5 / JAVASCRIPT / Model / module   /   No Comments
26
Oct
2014

AngularJS built-in directives notice! 'ng-' or 'data-ng-' prefix indicates of angular directive (see directives list at the api reference) types - Element (E) <ng-my-directive></ng-my-directive> - Attribute (A) <span ng-my-directive></span> - CSS class (C) <span class="ng-my-directive: expression;"></span> - Comment (M) <!-- directive: ng-my-directive expression --> ng-app init the angular. wherever this directive will be defined - it would be the application scope. its recommended to add this directive within the html tag.

Read more
  • פיתוח מערכות
  • פתרונות טכנולוגים
  • קידום אתרים
  • בניית אתרים