入门 - 控制器不是一个功能未定义

时间:2016-06-20 01:50:10

标签: javascript html angularjs

我开始使用Angular路线。当我为someNameController定义角度路由时,将其代码放入控制器文件并将html放入html文件中,控制器似乎与html绑定不好。但是,它与我的其他控制器正常工作。

我尝试过的链接: DoAsyncRequest ngRoute not working. is there something i am doing wrong angularjs ngRoute not working

的index.html

 <!DOCTYPE HTML>
    <html>
        <head>
            <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

            <script src="bower_components/angular/angular.min.js"></script>
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>

            <script src="app.js"></script>
            <script src="config.js"></script>
            <script src="controllers/someNameController.js"></script>

        </head>
        <body>
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12">
                        <div class="jumbotron">
                            <div ng-app="someApp">
                                <div ng-view></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </body>
    </html>

someCustomersView.html

<div>
    <h2>
        Hello, world!
    </h2>
    <p>
        {{ desc }}
    </p>
    <p>
        <a class="btn btn-primary btn-large" href="#">Learn more</a>
    </p>
    <input type="text" class="form-control" ng-model="someName"/>
    <br>
    <p>{{ someName | uppercase }}</p>

    <ul ng-repeat="customer in customers">
        <li class="list-group-item">{{ customer | lowercase }}</li>
    </ul>
</div>

someNameController.js

someApp.controller("someNameController", function($scope){
    $scope.customers = ["Customer2", "Customer3", "Customer4", "Customer5"]
})

1 个答案:

答案 0 :(得分:1)

我在config.js文件中声明路由时犯了一个错误。 即使在html中包含控制器的脚本以及目录之后,我也在分配路由时分配目录。我在config.js中这样做:

someApp.config(["$routeProvider", function($routeProvider, $locationProvider){
    $routeProvider.when("/showSomeButtonsGroup", {
        templateUrl : "views/view3.html",
        controller : "controllers/page67Controller"
    })
    .when("/", {
        templateUrl : "views/someCustomersView.html",
        controller : "someNameController"
    })
}])

而不是这样:

someApp.config(["$routeProvider", function($routeProvider, $locationProvider){
    $routeProvider.when("/showSomeButtonsGroup", {
        templateUrl : "views/view3.html",
        controller : "page67Controller"
    })
    .when("/", {
        templateUrl : "views/someCustomersView.html",
        controller : "someNameController"
    })
}])