Handling events in Angular

Question

I am using a using angular js script of angular code this code not return nothing in html page i try it more times but also not return nothing Any idea or help to run this code

/// <reference path="angular.min.js" />
//var myApp = angular.module("myModule", []);

myApp = angular
   .module("mymodule", [])
    .controller("mycontroller", function ($scope) {
        var tecnologies = [
              { name: "c#", likes: 0, dislikes: 0 },
              { name: "asp.net", likes: 0, dislikes: 0 },
              { name: "sqlserver", likes: 0, dislikes: 0 },
              { name: "Angulaer js", likes: 0, dislikes: 0 },
        ];
        $scope.tecnologies.tecnologies;
        $scope.incrementlikes=function(tecnologyy)
        {
            tecnologyy.likes++;
        }
        $scope.incrementdislikes = function (tecnologyy) {
            tecnologyy.dislikes++;
        }
    });

Markup:

<!DOCTYPE html>
<html xmlns="xmlns= http //www.w3.org/1999/xhtml">
<head>

    <title></title>
    <!--<script src="scripts/angular.min.js"></script>-->
    <script src="scripts/angular.min.js"></script>
    <script src="scripts/angular.js"></script>
    <!--<script src="scripts/Script.js"></script>-->
    <script src="scripts/JavaScript9.js"></script>
    <!--<script src="scripts/angular.js"></script>-->
    <title></title>
</head>
<body ng-app="mymodule">
    <div ng-controller="mycontroller">
        <table>
            <tr>
                <th>Name</th>
                <th>likes</th>
                <th>dislikes</th>
                <th>Likes/dislikes</th>
            </tr>
            <tbody>
                <tr ng-repeat="tecnolgy in tecnologies">
                    <td>{{tecnolgy.name}}</td>
                    <td>{{tecnolgy.likes}}</td>
                    <td>{{tecnolgy.dislikes}}</td>
                    <td>
                        <input type="button" value="Like" ng-click="incrementlikes(tecnolgy)">
                        <input type="button" value="disLike" ng-click="incrementdislikes(tecnolgy)">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>


</body>
</html>

why two angular libs are loaded there at top.

Jai
– Jai

2016-06-07 12:29:32 +00:00
Commented Jun 7, 2016 at 12:29 — Jai
– Jai, Commented Jun 7, 2016 at 12:29

Jai · Accepted Answer · 2016-06-07 12:38:46Z

change this:

$scope.tecnologies.tecnologies;

to this:

$scope.tecnologies = tecnologies;

Although i have noticed some of the pointers:

Two angular libs are loaded at the head.
Better to cache the module then assign the controller.
You have not bound/assigned the actual array.

Pointers:

1.

<script src="scripts/angular.min.js"></script>
<!--<script src="scripts/angular.js"></script>-->

2,3.

var myApp = angular.module("mymodule", []);

myApp.controller("mycontroller", function($scope) {
  var tecnologies = [
      { name: "c#", likes: 0, dislikes: 0 },
      { name: "asp.net", likes: 0, dislikes: 0 },
      { name: "sqlserver", likes: 0, dislikes: 0 },
      { name: "Angulaer js", likes: 0, dislikes: 0 },
  ];
  $scope.tecnologies = tecnologies;
  $scope.incrementlikes = function(tecnologyy) {
    tecnologyy.likes++;
  };
  $scope.incrementdislikes = function(tecnologyy) {
    tecnologyy.dislikes++;
  };
});

Guruprasad J Rao · Accepted Answer · 2016-06-07 12:32:43Z

1

The way you've assigned technologies array to scope is not proper. You should do it as follows:

$scope.tecnologies=tecnologies;

answered Jun 7, 2016 at 12:32

Guruprasad J Rao

29.7k16 gold badges113 silver badges212 bronze badges

2 Comments

Guruprasad J Rao Over a year ago

Anytime.. Happy coding.. :)

Guruprasad J Rao Over a year ago

Do not switch the answer buddy.. Once you've accepted any, change it only if you feel the new one is right.. At a time only one answer can be accepted.. :) I feel @Jai's answer should be marked as answer, since its a detailed one..

Collectives™ on Stack Overflow

Handling events in Angular

2 Answers 2

Comments

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Related