加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angularjs – 如何将模型属性用作变量ng-click

发布时间:2020-12-17 06:50:25 所属栏目:安全 来源:网络整理
导读:我想在我的模型中将ng-click函数调用存储为字符串. 我不能使用ng-click =“m.func”,如果我使用ng-click =“{{m.func}}”也不能正常工作. http://jsfiddle.net/j8wW5/19/ 在ng-click =“{{m.func}}”的情况下,它看起来像角度1.2.0会抛出错误. 我怎样才能把它
我想在我的模型中将ng-click函数调用存储为字符串.
我不能使用ng-click =“m.func”,如果我使用ng-click =“{{m.func}}”也不能正常工作.

http://jsfiddle.net/j8wW5/19/

在ng-click =“{{m.func}}”的情况下,它看起来像角度1.2.0会抛出错误.

我怎样才能把它带到工作中?

<div ng-app="myApp" ng-controller="myCtrl">
    <div ng-repeat="m in model"><a href="#" ng-click="{{m.func}}">{{m.caption}}</a></div>
</div>

var app = angular.module('myApp',[]);

app.controller('myCtrl',function($scope) {
    $scope.model = [
        {
            caption: 'callme a',func : 'callme_a()'
        },{
            caption: 'callme b',func : 'callme_b()'
        }
    ]

    $scope.callme_a = function() {
        alert("called a");
    }

    $scope.callme_b = function() {
        alert("called b");
    }
});

解决方法

可能是ng-click在将其评估为字符串之前使用ng-click属性将事件侦听器附加到dom.

所以,我已经用超时来覆盖ngclick来制作你想要的东西:)

var app = angular.module('myApp',[]); 
app.directive('ngClick',['$timeout','$parse',function($timeout,$parse) {
          return {
              compile: function($element,attr) {
                  return function(scope,element,attr) {
                      //I've wrapped this link function code in a $timeout
                      $timeout(function() {
                          var fn = $parse(attr["ngClick"]);
                          $(element[0]).on("click",function(event) {
                              scope.$apply(function() {
                                  fn(scope,{$event:event});
                              });
                          });
                      })
                  };
              }
          };
      }]);

(这是ngClick的源代码 – https://github.com/angular/angular.js/blob/master/src/ng/directive/ngEventDirs.js)

在这里用演示 – http://jsfiddle.net/R2Cc9/5/检查小提琴

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读