Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I have my data in the following format,

        var data = [{"time":1,"description":"Here lies 1","cost":"10"},{"time":2,"description":"Here lies 2","cost":"20"},{"time":3,"description":"Here lies 3","cost":"10"},{"time":4,"description":"Here lies 3","cost":"10"}]    

which I am trying to render using

<div class="container">
                <h3 class="text-center">Welcome to our scheduling page. Please follow the instructions to add an event to my calendar.</h3> 
             <div ng-app="TimeSlot">
                <div class="col-md-12" ng-controller="TimeSlotController as calendar" >
                     <div class="col-md-5 col-md-offset-1 timeblock" ng-repeat="slots in calendar.timeslot" ng-click="">
                        <h3 class="event-type-name">{{slots.time}} Hour Appointment</h3>
                        <div class="description mts">{{slots.description}}</div>
                        <div class="cost">{{slots.cost }}</div>
                     </div>
                </div>

             </div> 

        </div>

and

var timeslots = data;

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

app.controller("TimeSlotController", function($scope) {

    this.timeslot = timeslots;

});

The divs are repeating according to the number of objects but the values are not getting inserted into the view, why is that so ?

This might look a repeat of my previous question but it's not exactly the same, sorry if I am repeating though.

share|improve this question
    
Cannot reproduce neither with old angular nor new –  Ninsly Nov 26 at 18:35
    
jsfiddle.net/1qwo1wcu –  Bazinga777 Nov 26 at 18:39
    
You don't have angular included in that fiddle. angular-animate.js is an addon for angular.js, it is not a replacement for it. You need both –  Ninsly Nov 26 at 18:41
    
sorry you are right, it does work in the new version as well; its funny how im not able to do it locally –  Bazinga777 Nov 26 at 18:43
    
I am using handelbars, does it help in anyway ? –  Bazinga777 Nov 26 at 18:44

2 Answers 2

I think your code is wrong.. try this

app.controller("TimeSlotController", function($scope) {

    $scope.timeslot = timeslots;

});



<div ng-app="TimeSlot">
     <div class="col-md-12" ng-controller="TimeSlotController" >
        <div class="col-md-5 col-md-offset-1 timeblock" ng-repeat="slots in timeslot" ng-click="">
            <h3 class="event-type-name">{{slots.time}} Hour Appointment</h3>
            <div class="description mts">{{slots.description}}</div>
            <div class="cost">{{slots.cost }}</div>
        </div>
     </div>
</div>
share|improve this answer
    
It is not working http://jsfiddle.net/v145Lzay/ –  vamsikrishnamannem Nov 26 at 18:50
    
Please check this out jsfiddle.net/bdyruno0 –  Sergio A. Nov 26 at 19:20

My problem was with handlebars, so I simply used the interpolate provider to fix it.

https://docs.angularjs.org/api/ng/provider/$interpolateProvider

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.