ERROR TypeError: Cannot read property 'name' of undefined - Using angularjs

Question

I'm trying to get ng-repeat to repeat a list of topics, but I'm getting this error.

ERROR

> TableUsersComponent.html:23 ERROR TypeError: Cannot read property
> 'name' of undefined
>     at Object.eval [as updateRenderer] (TableUsersComponent.html:23)
>     at Object.debugUpdateRenderer [as updateRenderer] (core.js:11080)
>     at checkAndUpdateView (core.js:10456)
>     at callViewAction (core.js:10692)
>     at execComponentViewsAction (core.js:10634)
>     at checkAndUpdateView (core.js:10457)
>     at callViewAction (core.js:10692)
>     at execComponentViewsAction (core.js:10634)
>     at checkAndUpdateView (core.js:10457)
>     at callWithDebugContext (core.js:11344)

HTML CODE

<div ng-app="DemoApp" ng-controller="DemoController" class="ng-scope ng-binding">
<h1>Topics</h1>
<ul><li ng-repeat="tpname in TopicNames track by $index">
    {{tpname.name}}
    </li></ul>
</div>

JS CODE

var app = angular.module('DemoApp',[]);
  app.controller('DemoController', function($scope){
    $scope.model = {};
  $scope.TopicNames =[
    {name: "What controller do from Angular's perspective"},
    {name: "Controller Methods"},
    {name: "Building a basic controller"}]; 
    });

Answer 1

I have tried your code in snippet and it's working fine. Kindly find it where you miss anything by comparison with yours and this snippet codes.

 var app = angular.module('DemoApp',[]); app.controller('DemoController', function($scope){ $scope.model = {}; $scope.TopicNames =[ {name: "What controller do from Angular's perspective"}, {name: "Controller Methods"}, {name: "Building a basic controller"}]; }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script> <div ng-app="DemoApp" ng-controller="DemoController" class="ng-scope ng-binding"> <h1>Topics</h1> <ul><li ng-repeat="tpname in TopicNames track by $index"> {{tpname.name}} </li></ul> </div>