Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
​
</body>
</html>
​
<!DOCTYPE html>
<html ng-app="testApp">
​
  <head>
<meta name="description" content="primitive test, working" />
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"></script>
    <script src="app.js"></script>
    <link rel="stylesheet" href="style.css" />
  </head>
​
  <body>
    <h3>Primitive test, One controller, working...</h3>
    <div ng-controller="Ctrl1">
      <h3>This is Ctrl1 :</h3>
      <input type="text" ng-model="myPrimitiveObj.strVal" /> 
      <input type="text" ng-model="myPrimitiveObj.numVal" /> 
      <input type="text" ng-model="myPrimitiveObj.boolVal" /> 
      
      <button type="button"  ng-click="setData()">Set New Data</button>
    </div>
    
    
    
  </body>
​
</html>
​
 
.ng-scope  {
  border: 1px solid red;
  margin: 3px;
}
 
//---------------------------------------------------
//primitive test, One controller, working...
//---------------------------------------------------
​
var app = angular.module('testApp', []);
​
app.controller('Ctrl1', function($scope) {
  $scope.index = 0;
  var primitiveObj = {
    strVal: 'string',
    numVal: 0,
    boolVal: false
  };
  
  $scope.myPrimitiveObj = primitiveObj;
  
  $scope.setData = function() {
    primitiveObj.strVal = 'string '+$scope.index++;
    console.log(primitiveObj.strVal);
​
    primitiveObj.numVal++;
    console.log("primitiveObj.numVal=",primitiveObj.numVal);
​
    primitiveObj.boolVal =!primitiveObj.boolVal;
    console.log("primitiveObj.boolVal=",primitiveObj.boolVal);
  
  };
});
​
Output 300px

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

Dismiss x
public
Bin info
jeremykopro
0viewers