angular js Usage

https://docs.angularjs.org/api

JSON.stringfy = $filter('json')( obj , 2);

JSON.parse() = angular.fromJson( jsonstr )

Usage

In HTML Template Binding
{{ json_expression | json : spacing}}

In JavaScript
$filter('json')(object, spacing)

Arguments

Param
Type
Details

object
*

Any JavaScript object (including arrays and primitive types) to filter.

spacing


(optional)
number

The number of spaces to use per indentation, defaults to 2.



returns string (json string)

https://angular-ui.github.io/bootstrap/


Modal (ui.bootstrap.modal)

$uibModal is a service to create modal windows. Creating modals is straightforward: create a template, a controller and reference them when using $uibModal.

The $uibModal service has only one method: open(options).




$uibModal's open function



Events fired:
$uibUnscheduledDestruction - This event is fired if the $scope is destroyed via unexpected mechanism, such as it being passed in the modal options and a $route/$state transition occurs. The modal will also be dismissed.





app.controller('mainController', function ($scope, $uibModal) {

    $scope.eventClicked = function(event) {

        var modalInstance = $uibModal.open({

            templateUrl: 'modalContent.html',

            controller: 'modalInstanceController',

            size: event.length,

            resolve: {

                items: function () {

                    return event;

                }

            }

        });

    };



});





app.controller('modalInstanceController', function ($scope, $uibModalInstance, items) {



        $scope.items = items;



        //console.log ("modalInstanceController ::: items :::");

        //console.log (items);

        $scope.selected = {

            item: $scope.items[0]

        };



        $scope.ok = function () {

            //$uibModalInstance.close($scope.selected.item);

        };



        $scope.cancel = function () {

            //$uibModalInstance.dismiss('cancel');

        };

    });







<script type="text/ng-template" id="modalContent.html">

        <div class="modal-header">

            <h3 class="modal-title">{{ items.title }}</h3>

        </div>

        <div class="modal-body">

            <p>startDate: <pre>{{ items.startsAt | date:'dd MMM yyyy' }}</pre></p>

            <p>endDate: <pre>{{ items.endsAt | date:'dd MMM yyyy' }}</pre></p>



        </div>

        <div class="modal-footer">

            <button class="btn btn-primary" ng-click="$close()">OK</button>

        </div>

    </script>






Colored by Color Scripter
cs


angular-bootstrap-calendar : example

http://mattlewis.me/angular-bootstrap-calendar/

http://mattlewis.me/angular-bootstrap-calendar/#?example=kitchen-sink

custom Filter

app.filter('unsafe', function($sce) { return $sce.trustAsHtml; });

app.filter('underscoreless', function () {

    return function (input) {

        return input.replace(/_/g, ' ');

    };

});



<a ng-bind-html="item.TITLE | unsafe" >{{ item.TITLE }}</a>

<a>{{ value | underscoreless }}</a>


Colored by Color Scripter
cs