AngularJS '$ sce.trustAsHtml is ignored

Question

I'm new to AngularJS, and it seems to me that I'm just scratching the surface of what's possible with a wireframe. However, I am having problems with the sce.trustAsHtml function. I am running AngularJS 1.2.4.

In my application, I load elements using JSON. These items are displayed in the list using the directive. Sometimes I would like to add HTML to the resulting content (for example, to make links clickable).

I read that I can use $ sce.trustAsHtml to enable html in bind. However, the following snippet does not work. I would expect all the elements to be replaced with bold "test", but instead it displays <strong>Test</strong>for each element.

Is there an easy way to make this piece of work?

angular.directive('ngStream', function($timeout, $sce) {
    var url = "getitems.json";
    return {
        restrict: 'A',
        scope: {},
        templateUrl: 'templates/app_item.html',
        controller: ['$scope', '$http', function($scope, $http) {
            $scope.getItems = function() {
                $http.get(url,{}).success(function(data, status, headers, config) {
                    $scope.items = data;
                });
            }
        }],
        link: function(scope, iElement, iAttrs, ctrl) {
            scope.getItems();
            scope.$watch('items', function(newVal) { if (newVal) {
                angular.forEach(newVal, function(vars,i) {
                    # Example html string for testing purposes.
                    var editedContent = '<strong>Test</strong>';
                    newVal[i].contentHtml = $sce.trustAsHtml(editedContent)
                });
            }});
        },
    }
});

Answer 1

? $sce.trustAsHtml ng-bind-html ng-bind ( {{}})