Angular 101

I am finally getting around to experimenting with Angular. By now you have probably have seen the 20ish minute talk,   or learn it in one day .  But, the first talk I went to on Angular was with The Google Development group here in Triangle last year.

Here is Kyle's sample which I partially modified:

Sample html:

 <div id="tab1EnhancedAddCmts" ng-app="NowPlaying">

                  <div ng-controller="MyCtrl">

                  <input type="text" ng-model="username">

                 <h1>Hello {{username}}</h1>

                <h2>My Favorite Libraries</h2>

              <ul><li ng-repeat="library in libraries">{{library}}</li></ul>

             <button ng-click="doSomething()">Click Me!</button>

             </div>

 </div>

Sample javascript:

<script language="javascript" src="appcontent/js/libs/angular/1.2.16/angular.min.js"></script>

<script type="text/javascript" language="javascript">

                                   

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

app.controller(‘MyCtrl’, ['$scope', ' NowPlayingSvc',

       function($scope,    NowPlayingSvc) {

                    

            $scope.doSomething = function() {

                    

            alert('doSomething');

            NowPlayingSvc.libraries.push($scope.username);                                                                                                                      

       };

        $scope.username = 'Kyle Buchanan';

        $scope.libraries = NowPlayingSvc.libraries;

}]);

                       

app.factory('NowPlayingSvc', [

       function() {

            return {

                     libraries: [

                                    'MooTools',

                                     'Scriptaculous', 

                                      'Ember'

                                 ]

             };

}]);

</script>

https://github.com/trianglejs/presentations/tree/master/angularjs

More info:

https://speakerdeck.com/gillesruppert/angularjs-the-good-the-bad-and-the-ugly

https://github.com/Sharondio/talks/blob/master/2013/adding-angular-to-existing-apps/adding-angular.md

http://textiles.online.ncsu.edu/online/Play/fb6c860da6da467da6440218f46d7fe01d?catalog=109c4c50-f182-410f-a13a-b31be9cf5323

http://textiles.online.ncsu.edu/online/Play/e3a1b51c1642468cbbf81ac8781406ad1d?catalog=109c4c50-f182-410f-a13a-b31be9cf5323

http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory