Question

您好我正在开发应用程序并解决问题。我检查了控制台但没有错误消息。

我创建了一个组件，然后将其插入到其他模板中。模板本身正在工作（按钮被渲染，我检查了元素ng-click属性），但是当我点击按钮时。该函数未被触发。

这个项目可以在这里找到：https://github.com/Aozaki-Touko/webApplication-dota2hero/tree/master/app

navbar.component.js：

"use strict";

angular.module("navbar").component("navbar", {
  templateUrl: "/navbar/navbar.template.html",
  controller: [
    "$location",
    function($location) {
      var self=this;
      self.changeToHeroes = function(){
        alert("Button Pressed!");
        $location.path("/heroes");
      };
    }
  ]
});

navbar.template.html：

<button type="button" ng-click="$ctrl.changePathToHeroes()">Heroes</button>

navbar.module.js：

"use strict";

angular.module("navbar",[]);

Answer 1

应该是，

<button type="button" ng-click="changePathToHeros()">Heroes</button>

Answer 2

使用 controllerAs

angular.module("navbar").component("navbar", {
  templateUrl: "/navbar/navbar.template.html",
  controllerAs:"$ctrl",
  controller: [
    "$location",
    function($location) {
      var $ctrl = this;
      $ctrl .changeToHeroes = function(){
        alert("Button Pressed!");
        $location.path("/heroes");
      };
    }
  ]
});

Answer 3

这对我有用。在我看来，这是函数名称的一个问题。

＆＃13;

administrator@domain.com
hostmaster@domain.com
admin@domain.com
postmaster@domain.com
webmaster@domain.com

＆＃13;

"use strict";

angular.module("navbar").component("navbar", {
  templateUrl: "/navbar/navbar.template.html",
  controller: [
    "$location",
    function($location) {
      var self = this;
      function changePathToHeroes(){
        alert("Button Pressedddddd!");
        $location.path("/heroes");
      }
      self.changePathToHeroes = changePathToHeroes;
    }
  ]
});

＆＃13;

即使我在控制器中注册了该功能，ng-click也不会触发

3 个答案: