带角度ng-click并调用控制器功能不起作用 [英] Angular ng-click with call to a controller function not working

查看:63
本文介绍了带角度ng-click并调用控制器功能不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我需要将变量传递给另一个控制器.我有以下与ListCtrl相关的代码:

I need to pass a variable to another controller. I have the following code which is related to the ListCtrl :

<a href="#items" data-router="article" ng-click="changeListName('metro')">

链接将转到另一个控制器ItemCtrl.

The link is going to another controller, ItemCtrl.

我想将变量传递给ItemCtrl.我想到要使用一个名为SharedProperties的服务:

I want to pass a variable to the ItemCtrl. I thought of using a service called SharedProperties :

service('sharedProperties', function () {
    var list_name = '';

    return {
        getListName: function() {
            return list_name;
        },
        setListName: function(name) {
            list_name = name;
        }
    };
});

单击链接后,我会调用一个角度单击事件来触发以下功能:

When the link is clicked, I call an angular click event to trigger the following function :

$scope.changeListName = function(name) {
    sharedProperties.setListName(name);
};

但是,ng-click似乎并没有改变我共享属性的值...

However, the ng-click does not seem to change the value of my shared property...

更新

我在ng-click触发的函数中放置了一个警报,并且警报被触发了.

I put an alert inside the function triggered by ng-click and the alert is triggered, as it should be.

但是,当我这样编写函数时:

However, when I write my function like this :

$scope.changeListName = function(name) {
    sharedProperties.setListName(name);
};

它不起作用...看起来像'sharedProperties.setListName(name);'没有执行...

It doesn't work... it looks like 'sharedProperties.setListName(name);' is not executed...

如果我使用虚拟名称(例如Metro)将其放置在函数之外,则它可以正常工作.

If I put it outside the function with a dummy name (eg. metro), it works..

更新3

我尝试了多种方法,并且我很确定问题出在此功能上:

I tried multiple things and I am pretty confident that the problem is with this function :

$scope.changeListName = function(list_name) {
    sharedProperties.setListName(list_name);
};

您知道为什么会这样吗?

Do you have any idea why this is happening?

推荐答案

您可能应该使用 ngHref 指令以及ngClick:

You should probably use the ngHref directive along with the ngClick:

 <a ng-href='#here' ng-click='go()' >click me</a>

这里是一个示例: http://plnkr.co/edit/FSH0tP0YBFeGwjIhKBSx?p=preview

<body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    {{msg}}
    <a ng-href='#here' ng-click='go()' >click me</a>
    <div style='height:1000px'>

      <a id='here'></a>

    </div>
     <h1>here</h1>
  </body>

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

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.go = function() {

    $scope.msg = 'clicked';
  }
});

我不知道这是否可以与您正在使用的库一起使用,但至少可以让您链接并使用ngClick函数.

I don't know if this will work with the library you are using but it will at least let you link and use the ngClick function.

**更新**

这是该设备的演示,可以很好地使用服务.

Here is a demo of the set and get working fine with a service.

http://plnkr.co/edit/FSH0tP0YBFeGwjIhKBSx?p=preview

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

app.controller('MainCtrl', function($scope, sharedProperties) {
  $scope.name = 'World';

  $scope.go = function(item) {
    sharedProperties.setListName(item);


  }

  $scope.getItem = function() {

    $scope.msg = sharedProperties.getListName();
  }
});

app.service('sharedProperties', function () {
    var list_name = '';

    return {

        getListName: function() {
            return list_name;
        },
        setListName: function(name) {
            list_name = name;
        }
    };


});

*编辑*

请查看 https://github.com/centralway/lungo-angular-bridge ,其中讨论了如何使用隆鼻和有角度的.另外请注意,如果浏览到另一个链接时页面完全重新加载,则需要将共享属性持久存储到本地存储和/或Cookie中.

Please review https://github.com/centralway/lungo-angular-bridge which talks about how to use lungo and angular. Also note that if your page is completely reloading when browsing to another link, you will need to persist your shared properties into localstorage and/or a cookie.

这篇关于带角度ng-click并调用控制器功能不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆