javascript - angularjs ng- Controller 不起作用

标签 javascript angularjs

我正在尝试使用 AngularJS,但我的“ng-controller”不起作用。

<!DOCTYPE html>
  <html>
    <head>
      <script type="text/javascript" src="lib/angular.js"></script>
    </head>
    <body ng-app>
      <h1>Add user</h1>
      <form action="addUser" method="post">
        <input type="text" name="pseudo" placeholder="pseudo">
        <input type="password" name="password" placeholder="password">
        <input type="submit" value="envoyer">
      </form>
      {{1 + 2}}
      <div ng-controller="myController">
      {{ name }}
    </div>
    <a href="./remove">supression</a>
    <script type="text/javascript">
      function myController($scope){
        alert("test");
        $scope.name = 'toto';
      }
    </script>
  </body>
</html>

当我在 Chrome 中尝试此操作时,{{1+2}} 被正确替换为“3”,但 {{name}} 不是。我期待“toto”。

我还尝试在点击事件时显示警报,但它不起作用:

<script type="text/javascript">
  var myApp = angular.module('MyApp', []);
  myApp.controller('myController', ["$scope",function($scope){
    $scope.name = 'toto';
    $scope.onMyButtonClick = function(){
      alert("test");
    }
  }])
</script>

HTML

<div ng-controller="myController">
    {{ name }}
    <button ng-click="onMyButtonClick">test</button>
</div>

当我点击时,没有任何反应。

最佳答案

尝试:<body ng-app> ==> <body ng-app="MyApp">

在你的脚本中:

angular.module('MyApp', [])
.controller('myController', ["$scope",function($scope){
    $scope.name = "toto"
}])

关于javascript - angularjs ng- Controller 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30649360/

相关文章:

javascript - 从 javascript 访问 Excel 工作簿

javascript - ngOptions 创建空下拉列表

javascript - Angular-ui typeahead 仅在退格键上给出正确的结果

javascript - Angular 相同的模块的多个指令

带有 AngularJS 的 jQuery 日期选择器 : "TypeError: element.datePicker is not a function"

javascript - 仅使用对该对象的引用替换数组中的对象

javascript - 始终在屏幕上显示表格的第一行和第一列

javascript - Knockout js - 获取可观察的字符串长度

javascript - 从匿名 HTTP.call() 获取数据

javascript - 使用 IE9 支持的 jQuery 旋转一个 div