Welcome to JS Bin

JS Bin

Save
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
    <p ng-controller="MainCtrl">{{aPerson.name}} - {{aPerson.country}}</p>
    <div ng-controller="SecondCtrl">
      {{aPerson.name}} - {{aPerson.country}}
      <button ng-click="updateIt()">Update it</button>
    </div>
  </body>
</html>
 
app = angular.module 'app', []
​
app.controller 'MainCtrl', ($scope, personService) ->
  $scope.aPerson = personService.getById(1)
  
app.controller 'SecondCtrl', ($scope, personService) ->
  $scope.aPerson = personService.getById(2)
  $scope.updateIt = () ->
    $scope.aPerson.update()
  
class Person
​
  constructor: (json) ->
    angular.extend @, json
    
  update: () ->
    @name = "Dave"
    @country = "Canada"
    
  @getById: (id) ->
    new Person
      name: "Jesus"
      country: "Spain"
      
app.factory 'personService', () ->
  {
    getById: Person.getById
  }
​
  
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x