【问题标题】:$routeProvider in AngularJs is not WorkingAngularJs 中的 $routeProvider 不起作用
【发布时间】:2014-03-10 16:05:11
【问题描述】:

我正在使用 angularJs 并且是新手。我在 $routeProvider 中遇到问题。

如果有人可以帮助我,请提前感谢:)

当我在萤火虫中看到它显示没有为 $routeProvider 设置参考。

这是我的代码..

main.html.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="demoApp"><!--you can use  data-ng-app directive also-->
<head>
<title>Using Directive With DataBinding</title>
<script src="Scripts/angular.min.js"></script>

<script>
    //var demoApp = angular.module('demoApp', ['helperModule']);
    var demoApp = angular.module('demoApp', []);

    demoApp.config(function($routeProvider) {
        $routeProvider
            .when('/', {
                controller: 'SimpleController',
                templateUrl: 'View1.html'
            })
            .when('/view2', {
                controller: 'SimpleController',
                templateUrl: 'View2.html'
            })
            .otherwise({ redirectTo: '/' });
    });
    var controllers = {};
    controllers.SimpleController = function ($scope) { // here $scope is dependency injection
        $scope.customers = [
            { name: 'Sombir', city: 'Rohtak' },
            { name: 'Surender', city: 'Hissar' },
            { name: 'Virender', city: 'Panipat' },
            { name: 'Kapil', city: 'Jhajjar' }
        ];
        $scope.addCustomer = function() {
            $scope.customers.push(
            {
                name: $scope.newCustomer.name,
                city: $scope.newCustomer.city   
            });
        };
    };
    demoApp.controller(controllers);
</script>
</head>
<body>
<div>
    <div data-ng-view=""><!--PlaceHolder for views--></div>
</div>    
</body>
</html>


View1.html
-----------------

<div class="container">
    Name:
    <input type="text" ng-model="filter.name" /><!--you can use data-ng-model directive also-->

    <h3>Adding A simple Controller --View1</h3>
    <ul>
        <li data-ng-repeat="cust in customers | filter:filter.name | orderBy:'city'">{{cust.name | uppercase}}---{{cust.city}}</li>
    </ul>
    <br/>
    Customer Name:
    <input type="text" ng-model="newCustomer.name"/>
    Customer City:
    <input type="text" ng-model="newCustomer.city" />
    <br/>
    <button ng-click="addCustomer()">Add Customer</button>
    <a href="#/View2">View2</a>
</div>

【问题讨论】:

    标签: angularjs-routing


    【解决方案1】:

    您忘记在脚本标签中的模块“demoApp”中注入“ngRoute”

      var demoApp = angular.module('demoApp', ['ngRoute']);
    

    【讨论】:

    • 我刚刚使用它,但现在对于 ngRoute 它也显示“ReferenceError:ngRoute 未定义”,请给我一些参考。对于 $routeProvider
    • 您好像忘记在脚本标签中添加“angular-route.js”,您能确认一下“angular-route.js”吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-10-14
    • 1970-01-01
    • 2018-05-25
    • 2014-10-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多