angularJS tutorial

https://docs.angularjs.org/tutorial

$apply vs $digest

https://www.sitepoint.com/understanding-angulars-apply-digest/

remove hash

https://scotch.io/tutorials/pretty-urls-in-angularjs-removing-the-hashtag
http://www.getursolution.com/2016/06/15/angularjs-pretty-url-remove-hash/

angular js deep linking

http://odetocode.com/blogs/scott/archive/2014/04/14/deep-linking-a-tabbed-ui-with-angularjs.aspx

ng-repeat filter more than one field or property

http://stackoverflow.com/questions/15868248/how-to-filter-multiple-values-or-operation-in-angularjs

8down vote

If you want to filter on Array of Objects then you can give filter:({genres: 'Action', key :value }. Individual property will be filtered by particular filter given for that property. But if you wanted to something like filter by individual Property and filter globally for all properties then you can do something like this. <tr ng-repeat="supp in $data | filter : filterObject | filter : search">

ng-repeat category by field

http://stackoverflow.com/questions/17514272/filtering-an-ng-repeat-list-based-on-a-sub-object-property

you are allowed to create new scope members inside the expressions.

filterdGoals1 and filterdGoals2 executed before it is being used

<div class="cfaesProfile_box">
  <div ng-repeat="goal in filterdGoals1 = (source.goals | filter: {goal_type:'1'} | filter:{goal_year:year.value})"></div>
  <div ng-repeat="goal in filterdGoals2 = (source.goals | filter: {goal_type:'2'} | filter:{goal_year:year.value})"></div>
  len={{filterdGoals.length}}
  <div ng-show="filterdGoals1.length">Performance</div>
  <div ng-if="year.value == goal.goal_year && !year.collapsed"          ng-repeat="goal in filterdGoals1">
    <div class="publist box-pop">
      <div class="cfaesProfile_row">
        <div ng-click="editGoal($index)"             class="cfaesProfile_option cfaesProfile_control fa fa-pencil"></div>
        <div class="cfaesProfile_option cfaesProfile_control fa fa-files-o"></div>
        <div class="cfaesProfile_option cfaesProfile_control fa fa-trash-o"></div>
        <div ng-click="goal.locked = !goal.locked"             ng-class="goal.locked ? 'fa-unlock' : 'fa-lock'"             class="cfaesProfile_option cfaesProfile_control fa"></div>
        <div class="cfaesProfile_label">
          <div ng-class-odd="depth_1" ng-class-odd="depth_1_alt">
            <span class="label_element goal-title">{{goal.goal_no}}.&nbsp{{goal.goal_content}}</span></br>
            <span class="label_element goal-title">{{goal.goal_progress}}</span>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div ng-show="filterdGoals2.length">Professonal Development</div>
  <div ng-if="year.value == goal.goal_year && !year.collapsed"       ng-repeat="goal in filterdGoals2">
    <div class="publist box-pop">
      <div class="cfaesProfile_row">
        <div ng-click="editGoal($index)"             class="cfaesProfile_option cfaesProfile_control fa fa-pencil"></div>
        <div class="cfaesProfile_option cfaesProfile_control fa fa-files-o"></div>
        <div class="cfaesProfile_option cfaesProfile_control fa fa-trash-o"></div>
        <div ng-click="goal.locked = !goal.locked"             ng-class="goal.locked ? 'fa-unlock' : 'fa-lock'"             class="cfaesProfile_option cfaesProfile_control fa"></div>
        <div class="cfaesProfile_label">
          <div ng-class-odd="depth_1" ng-class-odd="depth_1_alt">
            <span class="label_element goal-title">{{goal.goal_no}}.&nbsp{{goal.goal_content}}</span></br>
            <span class="label_element goal-title">{{goal.goal_progress}}</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

dynamically change orderBy in ng-repeat

<tr ng-repeat="ar in arrSOA  | orderBy: orderByVar">

just use logic in js file to change $scope.orderByVar

$scope.addSOA = function () {
    $scope.displayOrderChanged = false;
   $scope.showAddSOA = true;
    $scope.orderByVar = "$index";
....

custom filter $scope not defined

http://stackoverflow.com/questions/17596246/access-scope-variables-from-a-filter-in-angularjs

app.controller('AppController',
    function($scope) {
      $scope.var1 = 'This is some text.';
      $scope.var2 = 'And this is appended with custom filter.';
    }
  );


app.filter('filterReceiptsForDate', function () {
  return function (input, scope) {
    return input + ' <strong>' + scope.var2 + '</strong>';
  };
});

ng-repeat orderBy

| orderBy:'displayOrder'

default select drop down value angular js

http://plnkr.co/edit/BsnSvXlSASPm6EAY1brK?p=preview

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

app.controller('MainCtrl', function($scope) {
  $scope.options = [
    {
      name: 'Something Cool',
      value: 'something-cool-value'
    },
    {
      name: 'Something Else',
      value: 'something-else-value'
    }
  ];
 
  $scope.selectedOption = $scope.options[0];
});


<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.0.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js" data-semver="1.0.7"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <select
      ng-model="selectedOption"
      ng-options="option.name for option in options">
    </select>
    {{ selectedOption.value }}
  </body>

</html>

edit table cell

http://stackoverflow.com/questions/28421427/editable-table-cell-in-angularjs

angular js dropdown list tool tip

http://stackoverflow.com/questions/37481611/angularjs-tooltip-on-mouse-hover-to-single-value-of-dropdown-using-ng-options


http://codepen.io/chiragshah_mb/pen/WxNeZE?editors=1111

Angular JS dropdown list requred

http://tutlane.com/tutorial/angularjs/angularjs-select-box-dropdown-list-binding-with-validations-example

http://stackoverflow.com/questions/15360094/angularjs-dropdown-required-validation

http://stackoverflow.com/questions/30945705/how-can-i-validate-an-ng-repeated-dropdown-category-selector

This vs $scope

http://stackoverflow.com/questions/11605917/this-vs-scope-in-angularjs-controllers

debug AngularJs scope issue

Right mouse on element and inspect on the input not passing from Angular to JavaScript.





https://www.toptal.com/angular-js/top-18-most-common-angularjs-developer-mistakes

bind single array elements

https://coderanch.com/t/648284/HTML-CSS-JavaScript/AngularJS-bind-single-array-element

https://jsfiddle.net/we0s9tc8/2/

form inside form

http://stackoverflow.com/questions/32210696/angular-submit-form-inside-form

ng-options

http://stackoverflow.com/questions/13047923/working-with-select-using-angulars-ng-options

ANGULAR.JS: NG-SELECT AND NG-OPTIONS

https://www.grobmeier.de/angular-js-ng-select-and-ng-options-21112012.html
http://jsfiddle.net/jm6of9bu/2/

jquery date picker with angular js

http://stackoverflow.com/questions/18144142/jquery-ui-datepicker-with-angularjs

http://stackoverflow.com/questions/4923917/prev-next-icons-not-showing-in-customized-jquery-datepicker-theme

http://jsfiddle.net/xB6c2/121/