ngClick 函数使用"控制器作为"方法不起作用，无法$scope

Question

刚刚开始使用 angular，并且正在努力让 ngClick 运行。

我已经溢出了大多数潜在的解决方案，但都提到必须使用$scope才能使用 ngClick 才能工作。

但是，我知道只要您所在的页面分配了正确的控制器("控制器作为"方法(，您就不需要它，因此只要您的函数在此控制器中，它就应该可以工作。

但是，我正在努力让我的代码触发 - 没有错误回来，所以我可以调试。

这是我的设置如下：

Angular version: 1.6.4

路由器.js

state(‘exampleShow', {
  templateUrl: '/templates/example.html',
  controller: ‘exampleShowController as exampleShow'
})

控制器.js

exampleShowController.$inject = [‘Example’, '$state', 'User'];
function exampleShowController(Example, $state, User) {
 const exampleShow = this;
 function addExample() {
  console.log('click');
 }
}

示例.html

<button ng-click="addExample()" class="u-full-width button-primary">Add 
example</button>

我知道我在这里错过了一个菜鸟错误，但严重无法发现我错过了什么。

感谢您对此的任何启发。

K

Answer 1

由于你使用controller as语法，所以你需要将你的控制器函数绑定到this，并且你也必须在html中通过别名调用相同ng-click="exampleShow.addExample()"。

演示：

var myApp = angular.module('myApp', []);
myApp.controller('ExampleShowController', ExampleShowController);
ExampleShowController.$inject = [];
function ExampleShowController() {
  const exampleShow = this;
  exampleShow.addExample = function() {
    console.log('click');
  }
}

<script src="https://code.angularjs.org/1.5.2/angular.js"></script>
<div ng-app="myApp" ng-controller="ExampleShowController as exampleShow">
  <button ng-click="exampleShow.addExample()" class="u-full-width button-primary">Add example
  </button>
</div>

Answer 2

您没有在控制器中注入$scope。如果你想在模板中使用它，你的ng-click函数应该是范围的一部分