无法以角度加载控制器文件

时间:2018-03-27 06:48:27

标签: angularjs

我无法访问index.html文件中的$ scope.message。可能的原因是什么?我在控制台中也没有收到任何错误,路径也已解决。

这是代码: 的 ctrlConfig.js

( function() 

{

  angular.module('crudApp',['ngRoute']);

  console.log('called crud')

  crudApp.controller('crud', ['$scope','$http', function($scope,$http) {

  $scope.users={};

  $scope.message="We are connected"

  $http.get('/')
            .success(function(data) {
                console.log(data);
                $scope.users = data;
            })
            .error(function(err) {
                console.log('Error: ' + err);
            });
  }]);

  crudApp.config(config);

  crudApp.$inject =['$routeProvider']

  function config($routeProvider)
  {
    $routeProvider
      .when('/',{
        templateUrl:'/public/index.html'
      })
      .otherwise({
        redirectTo:'/'
      })

  }

})();

的index.html

<html ng-app="crudApp">
<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <title>CRUD</title>
</head>
<body ng-controller="crud">
  <div class="container">
    <div class="jumbotron">
      <h1>CRUD Operation</h1>
      <p>Using Node and Angular JS</p>
      {{message}}
    </div>
    <h3>List of Users</h3>
    <ul>
      <li>------</li>
      <li>------</li>
      <li>------</li>
    </ul>
    <form>
      <div class="form-group">
        <input class="form-control" style="width:30%" type="text" ng-model="uname" placeholder="Username">
      </div>
      <div class="form-group">
        <input class="form-control" style="width:30%" type="text" ng-model="hobbies" placeholder="Hobbies">
      </div>
      <input class="btn btn-success" type="button" value="Add User">
      <input type="reset" class="btn btn-primary">
    </form>
  </div>
  <script type="javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
  <script src="ctrlConfig.js" type="javascript"></script>
</body>
</html

我正在尝试使用实际显示从数据库中获取的一组数据的API。这就是我在这里使用$ http服务的原因。

1 个答案:

答案 0 :(得分:0)

在AngularJS 1.2.0及更高版本中,ngRoute已移至其自己的模块。您必须单独包含ngRoute库