Angular Not Rendering In My Json

I am trying to use angular which displays on the page the element from the json. Its not working. What I am trying to do is pretty straightforward. But its not working Here is my c

Solution 1:

All other comments / answers have some valid points. The major issue you're facing though is 1) your using an outdated Angular version ;-) and 2) you need to use the $sce service in order to create trusted HTML:

(function(app){
    app.controller('PortfolioController',function($sce){
        this.product = {
            name: 'TEmp',
            aboutme: $sce.trustAsHtml('A Computer Science student at <br>The University Canada.<br> <br>A Software Engineer')
        };
    });

})(angular.module('store', []));

http://jsfiddle.net/sqxmyrcj/7/

Cheers Gion

Solution 2:

There are 2 ways of managing your controller, you were going for the controller as approach and the other which is more widely used by most angularians is $scope.

docs

Basically $scope is injected into the controller and acts a the main object for that container

app.controller('Ctrl', function ($scope) {
  $scope.product = {
    name: ...
  };
});
...
{{product.name}}

scope fiddle fix

The controller as method allows greater flexibility but also has more prototypical complexity.

app.controller('Controller', function () {
  this.product = {
    name: ...
  };
});

<divng-controller="Controller as ctrl">
   {{ctrl.product.name}}
</div>

Solution 3:

There is some problems in your javascript. Mainly you should use the scope to set the variables that you want to show in your view. See this javascript and html:

JSFiddle

HTML:

<htmlng-app="store"><bodyng-controller="PortfolioController"><png-bind-html-unsafe='product.aboutme'></p></body></html>

JAVASCRIPT:

(function(){
    var app = angular.module('store', []);

    app.controller('PortfolioController',['$scope', function($scope){
        var gem = 
            {
        name: 'TEmp',
        aboutme: 'A Computer Science student at <br>The University Canada.<br>         <br>A Software Engineer'
        };

        $scope.product = gem;

    }]);
})();