javascript - 从不同的文件加载 Angular Controller 而不是 1

标签 javascript angularjs

我正在尝试从不同的 js 加载 Controller ,但没有成功,你们能帮我在页面上加载这个名为 StreetListCtrl.js 的 Controller 吗?

UsersListCtrl 加载完美,只是 StreetListCtrl 未加载/

我的html:

<!DOCTYPE html>
<html ng-app='myApp' lang="en">
  <head>
    <meta charset="utf-8">
    <title>angularjs</title>
    <script src="bower_components/angular/angular.min.js"></script>
    <script src='public/javascripts/ng-controller.js'></script>
  </head>
  <body>
                <table ng-controller="UsersListCtrl">
                    <thead>
                      <tr>
                        <th>Username</th>
                        <th>UserId</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr ng-repeat="user in users | orderBy:'id' ">
                        <td><strong>{{ user.name }}</strong></td>
                        <td>{{ user.id }}</td>
                      </tr>
                    </tbody>
                </table>
                  <p>street list </p>

                 <table ng-controller="StreetListCtrl">
                    <thead>
                      <tr>
                        <th>street name</th>
                        <th>id</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr ng-repeat="data in street | orderBy:'id' ">
                        <td><strong>{{ data.name }}</strong></td>
                        <td>{{ data.id }}</td>
                      </tr>
                    </tbody>
                </table>
  </body>
</html>

StreetListCtrl.js

angular.module('myApp')

myApp.controller('StreetListCtrl',['$scope',function($scope){
        $scope.street =[
        {name:'1 smithfield', id:3},
        {name:'2 river plate', id:1333},
        {name:'3 river plate', id:1}
    ];
}])

ng-controller.js:

angular.module('myApp', [])
.controller('UsersListCtrl',['$scope',function($scope){
        $scope.users =[
        {name:'douglas', id:3},
        {name:'bruno', id:1}
    ];
}])

最佳答案

您忘记了第二个 javascript 文件。你有:

<head>
  <meta charset="utf-8">
  <title>angularjs</title>
  <script src="bower_components/angular/angular.min.js"></script>
  <script src='public/javascripts/ng-controller.js'></script>
</head>

应该是:

<head>
  <meta charset="utf-8">
  <title>angularjs</title>
  <script src="bower_components/angular/angular.min.js"></script>
  <script src='public/javascripts/ng-controller.js'></script>
  <script src='public/javascripts/StreetListCtrl.js'></script>
</head>

和 StreetListCtrl.js 应该是:

angular.module('myApp').controller('StreetListCtrl',['$scope',function($scope){
        $scope.street =[
        {name:'1 smithfield', id:3},
        {name:'2 river plate', id:1333},
        {name:'3 river plate', id:1}
    ];
}])

关于javascript - 从不同的文件加载 Angular Controller 而不是 1,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33897299/

相关文章:

javascript - 重构解构语句

javascript - 如何在不关闭相邻选项卡的情况下使用 jQuery 切换选项卡。

try block 中的 JavaScript 作用域

javascript - 如何使用 Ajax 调用更新部分内容然后在 Rails 中呈现?

angularjs - $rootScope.currentUser 在刷新时为空

javascript - Angular-google-maps:如何设置当前用户在加载 map 上的位置?

javascript - 第一次迭代完成后更改计时器间隔

javascript - 将包含 HTML 标签的字符串传递给指令,标签未呈现

javascript - 在行内显示 jQuery dataTables 错误 (AngularJS)

javascript - 在 Angular 中重用部分和 Controller