javascriptangularjsangularjs-ng-click

AngularJS : ng-click not working


I am new in AngularJs, ng-click is not working as expected. I searched on the internet , Follow the tutorial , (that was working) - but this is not working!!!

My Code:

<div class="row" ng:repeat="follower in myform.all_followers | partition:2">
    <ons-col class="views-row" size="50" ng-repeat="data in follower" >
        <img ng-src="http://dealsscanner.com/obaidtnc/plugmug/uploads/{{data.token}}/thumbnail/{{data.Path}}" alt="{{data.fname}}" ng-click="showDetail2(data.token)"/>
        <h3 class="title" ng-click="showDetail2('ss')">{{data.fname}}</h3>
    </ons-col>
</div>

Here is my controller

//Follows Controller
app.controller('FollowsController', function($scope, $http) {
    var ukey = window.localStorage.ukey;

    $scope.myform ={};
    $scope.myform.reports ="";
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
    var dataObject = "usertoken="+ukey;
    var responsePromise = $http.post(server_url+"follows/", dataObject,{});
    responsePromise.success(function(dataFromServer, status,    headers, config) {
        $scope.myform.all_followers = dataFromServer;
        console.log(dataFromServer);

        //alert(dataFromServer);
        $scope.showDetail = function(index) {
            profileusertoken =  index;
            $scope.ons.navigator.pushPage('profile.html'); 
        }

        function showDetail2(index) {
            alert("here");
        }

        $scope.showDetail2 = showDetail2;
    });
});

Niether showDetail working nor showDetail2 Please help Thanks


Solution

  • Have a look at this plunker

    HTML:

    <!DOCTYPE html>
    <html ng-app="app">
    
      <head>
        <script data-require="angular.js@1.3.0-beta.16" data-semver="1.3.0-beta.16" src="https://code.angularjs.org/1.3.0-beta.16/angular.min.js"></script>
        <link rel="stylesheet" href="style.css" />
        <script src="script.js"></script>
      </head>
    
      <body ng-controller="FollowsController">
        <div class="row" ng:repeat="follower in myform.all_followers">
          <ons-col class="views-row" size="50" ng-repeat="data in follower">
            <img ng-src="http://dealsscanner.com/obaidtnc/plugmug/uploads/{{data.token}}/thumbnail/{{data.Path}}" alt="{{data.fname}}" ng-click="showDetail2(data.token)" />
            <h3 class="title" ng-click="showDetail2('ss')">{{data.fname}}</h3>
          </ons-col>
        </div>
      </body>
    
    </html>
    

    Javascript:

    var app = angular.module('app', []);
    //Follows Controller
    app.controller('FollowsController', function($scope, $http) {
        var ukey = window.localStorage.ukey;
        //alert(dataFromServer);
        $scope.showDetail = function(index) {
            profileusertoken =  index;
            $scope.ons.navigator.pushPage('profile.html'); 
        }
    
        function showDetail2(index) {
            alert("here");
        }
    
        $scope.showDetail2 = showDetail2;
        $scope.myform ={};
        $scope.myform.reports ="";
        $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
        var dataObject = "usertoken="+ukey;
        //var responsePromise = $http.post("follows/", dataObject,{});
        //responsePromise.success(function(dataFromServer, status,    headers, config) {
    
        $scope.myform.all_followers = [[{fname: "blah"}, {fname: "blah"}, {fname: "blah"}, {fname: "blah"}]];
    });