ng-bind

In my angular js app I have an array of objects $scope.time which contain a name, the current time and another defined time in milliseconds. In the front-end I'm using ng-bind to calculate the difference between these two time and display it in H:m:s format. Please run the code below. var app = angular.module('angularapp', []); app.filter("msTotime", function() { return function(timee,started,ended) { var startDate = new Date(started); var endDate = new Date(ended); var milisecondsDiff = endDate - startDate; var final = Math.floor(milisecondsDiff/(1000*60*60)).toLocaleString(undefined,

I am trying to store a HTML inside a scope variable and then use it in template view. When I was reading how to do this in angular, I came across ng-bind-html . In that I've noticed that when I bind html tags with <a> , <strong> , etc.. it works. But I am unable to add <input> tags to it. Meaning, this works: $scope.myHtml = '<strong>This is <a hreaf="#">Something</a></strong>'; Template: <p ng-bind-html="myHtml"> </p> But this doesnt work: $scope.myHtml = '<input type="text" />'; Template: <p ng-bind-html="myHtml"> </p> The above is just a simplified sample for demonstration purpose only. My

Here's the fiddle: http://jsfiddle.net/D5h7H/7/ It renders the following: <div ng-repeat="group in Model.Groups"> <span>{{group.Name}}</span> <div ng-repeat="filter in group.Filters"> <input type="checkbox" ng-model="filter.enabled">{{filter.Name}} <select ng-disabled="!filter.enabled"> <option ng-repeat="value in filter.Values">{{value}}</option> </select> </div> </div> It's a list of filters that is loaded in json from the server and then rendered to the user (in an example json is generated right there in Fiddle). At the moment there are 6 groups of 30 filters in each with 15 option

I'm currently learning AngularJS and am having difficulty understanding the difference between ng-bind and ng-model . Can anyone tell me how they differ and when one should be used over the other? Tosh ng-bind has one-way data binding ($scope --> view). It has a shortcut {{ val }} which displays the scope value $scope.val inserted into html where val is a variable name. ng-model is intended to be put inside of form elements and has two-way data binding ($scope --> view and view --> $scope) e.g. <input ng-model="val"/> . tosh 's answer gets to the heart of the question nicely. Here's some