RouteProvider Not working

RouteProvider Not working

本文关键字:working Not RouteProvider      更新时间:2023-09-26

我试图在angular中使用routeProvider,但它不起作用我的html

 <html>
<head>      
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body ng-app="Myapp">
     <ng-view></ng-view>
</body>
<script src="app.js"></script>
</html>

这里是app.js

var app = angular.module('Myapp',[]);
app.config(function($routeProvider){
    $routeProvider.when("/",
        {
        templateUrl:'data.html',
        controller: 'myctrl'
        }
    )
});
app.controller('myctrl',function($scope){
    $scope.model= {
        msg:"Route Worked"
    }
});

my template

<h1>{{model.msg}}</h1>

Html include <script> for ngRoute.

<html>
    <head>      
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <script src="https://code.angularjs.org/1.3.14/angular-route.js"></script>
    </head>
    <body ng-app="Myapp">
         <ng-view></ng-view>
    </body>
    <script src="app.js"></script>
</html>

app.js

var app = angular.module('Myapp',["ngRoute"]);
app.config(function($routeProvider){
    $routeProvider.when("/",
        {
            templateUrl:'data.html',
            controller: 'myctrl'
        }
    )
});
app.controller('myctrl',function($scope){
    $scope.model= {
        msg:"Route Worked"
    }
});

您需要首先安装angular-route并包含在您的项目中。然后像这样在应用程序中加载模块

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

详细信息请参见