Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html ng-app="application">
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script src="https://code.angularjs.org/1.2.25/angular.min.js"></script>
  <script src="https://code.angularjs.org/1.2.25/angular-sanitize.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap-tpls.min.js"></script>
</head>
<body ng-controller="Booking">
  
  
<div class="col-md-12">
  {{ name }}
    <div class="row adults insertAdults">
      <div ng-bind-html="myAdults"></div>
    </div>
  
  <div class="row adults insertChildren">
      <div ng-bind-html="myChildren"></div>
    </div>
</div>
</body>
</html>
 
var myApp = angular.module('application', ['ui.bootstrap','ngSanitize']);
myApp.controller("Booking", ['$scope', '$log', function($scope, $log){
  var i, z;
  $scope.name = "Booking Controller";
  
  $scope.adults = 4;
  $scope.children = 2;
  
  for (i = 0; i < $scope.adults; i ++) {
     //$log.log(i);
    $scope.myAdults = '<form><h4>Hello</h4>'+
         '<div class="form-group">'+
          '<label class="col-lg-2 control-label" for="inputEmail">Email</label>'+
          '<div class="col-lg-10">'+
          '<input type="text" ng-model="name_'+i+'" placeholder="Email" id="inputEmail" class="form-control">'+
          '</div>'+
          '</div>'+
        '</form>';
      }
  
  for (z = 1; i < $scope.children; z++) {
    $scope.myChildren = '';
  }
}]);
myApp.directive("tripGoers", function() {
  // To do .....
});
Output

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

Dismiss x
public
Bin info
anonymouspro
0viewers