喜欢和不同于角度js使用指令

时间:2015-04-04 10:43:02

标签: javascript jquery angularjs

HTML

<a href="javascript:;" class="replycommentbtn ng-binding" 
   ng-click="likeClick(uniqueid)"> Like (63)</a> &nbsp;| &nbsp; 

<a href="javascript:;" class="replycommentbtn ng-binding" 
   ng-click="unlikeClick(uniqueid)"> Unlike (14)</a>

指令

angular.module('AlbumlikeFeature',[]).directive('AlbumlikeFeature', ['$filter', '$route', function ($filter, $route) {
    return {
      restrict: 'E',
      scope: {},
      templateUrl: 'app/components/album/albumlikefeature.html';           

 scope.likeClick = function (dataid) {      
      var resultlike = dataid
      console.log(resultlike);
      resultlike.Like = resultlike.Like + 1;               
      scope.likeCount = resultlike.Like;
      scope.unlikeCount = resultlike.Unlike;             
 };

如何在其他控制器中调用指令模块? 我试过这个<albumlike-feature uniqueid="1" photoid="1"></albumlike-feature>,但没有结果。

我的要求是点击,就像我想增加价值一样,不像想要增加价值。我怎么能实现这个目标?

Like(1) ...想要像不同的那样增加计数值。

点击按钮

时出现此错误
ReferenceError: likeCount is not defined
    at Scope.scope.likeClick (albumlikefeature.js:15)
    at Parser.functionCall (angular.js:10795)
    at angular.js:19036
    at Scope.$get.Scope.$eval (angular.js:12632)
    at Scope.$get.Scope.$apply (angular.js:12730)
    at HTMLAnchorElement.<anonymous> (angular.js:19035)
    at HTMLAnchorElement.n.event.dispatch (jquery.min.js:3)
    at HTMLAnchorElement.n.event.add.r.handle (jquery.min.js:3)

2 个答案:

答案 0 :(得分:1)

指令名称必须遵循camelCase,因此在您的指令中对名称进行更改:

directive('AlbumlikeFeature',

将成为

directive('albumlikeFeature',

现在在您看来,请将其称为:

<albumlike-feature uniqueid="1" photoid="1"></albumlike-feature>

你的指令功能也错了,

templateUrl: 'app/components/album/albumlikefeature.html';

 scope.likeClick = function (dataid) {

            var resultlike = dataid
            console.log(resultlike);
            resultlike.Like = resultlike.Like + 1;               
            scope.likeCount = resultlike.Like;
            scope.unlikeCount = resultlike.Unlike;             
        };

如果您没有;函数,则不能在返回对象中包含link

angular.module('AlbumlikeFeature',[]).directive('albumlikeFeature', ['$filter', '$route', function ($filter, $route) {

return {
    restrict: 'E',
    scope: {},
    templateUrl: 'app/components/album/albumlikefeature.html',
    link : function(scope, element, attrs) {

      scope.likeClick = function (dataid) {
        var resultlike = dataid
        console.log(resultlike);
        resultlike.Like = resultlike.Like + 1;               
        scope.likeCount = resultlike.Like;
        scope.unlikeCount = resultlike.Unlike;             
      };
    }           
 }
}]);

答案 1 :(得分:0)

使用此

在点击之前,您需要将您的值定义为scope.likeCount = 0,并且同样不同...

只需使用+=1增加值即可。这对您有用..

angular.module('albumlikeFeature',[]).directive('albumlikeFeature', ['$filter', '$route', function ($filter, $route) {

return {
    restrict: 'E',
    scope: {},
    templateUrl: 'app/components/album/albumlikefeature.html',
    link : function(scope, element, attrs) {

        scope.likeCount = 0;
        scope.unlikeCount = 0;
        scope.likeClick = function (dataid) {
        scope.likeCount += 1;          
      };

       scope.unlikeClick = function (dataid) {
        scope.unlikeCount += 1;          
      };

    }           
 }
}]);